看法:
三要素:swf、data.xml、承载图表的载体
按照你所设计的图表类型加载相应的.swf文件到你的工程即可(eg:若你想生成一张二维柱状图,那么在你的工程里就必须包含Column2D.swf文件)
方法一:直接用data.jsp文件替代data.xml文件,写法格式同xml。图表所需的属性直接在里面写死就行,只是所需的横纵坐标的数据调用后台的方法从数据库里面取得。这样就可以省去xmlBuilder这部分代码。
方法二:从后台取数据,然后调用相应的xmlBuiler方法生成所需的xml。项目中已有一些XmlBuilder的方法可供调用。
HTML、JSP等都可以。调用fusionCharts开发方提供的fusioncharts.js里面写的fusionchart方法设置相关的参数直接生产相应的图表,产生一个fusioncharts图表的div节点。但是现在fusionCharts图表还不能直接嵌入到ext框架里面。只能通过iframe嵌入。这样每次刷新的时候都会从新载入。
导出、热点链接
fusionCharts开发方提供了两种方法实现,一种的客户端导出,一种是服务器端导出。建议使用客户端导出,使用开发方提供的服务器端导出的jar包时在IE上会抛出异常,在火狐上图表一般能显示,但在控制器也会抛出异常。开发方写的方法,有一些内部机制,没有完全理解。用服务器端的方法,可以正常使用。
主要应该是数据传递问题。一方面可以直接从data.xml文件里面的link属性设置你要传过来的参数,然后在你要连接的页面用get方法去获取。另一方面可以直接调用后台的方法把xml文件里面的数据以js的形式直接导入到你要连接的页面。
三、重点
1、FusionCharts的三要素
2、xml各属性的应用
fusionCharts的基本知识部分:
一、SWF动画文件
1. SWF文件在目录FusionCharts_Site\Charts下
2. 包括:
1) 单一系列图表(9种):(数据格式结构可共用,即单一系列的任何一种图表都可以用其他单一系列的图表代替)二维柱状图、三维柱状图、二维饼图、三维饼图、二维线图、二维条形图、二维块图、二维圆环图、三维圆环图。
2) 多序列图(6种):(主要用于比较,数据格式结构可共用)二维多序列柱状图、三维多序列柱状图、二维多序列线图、二维多序列块图、二维多序列条形图、三维多序列条形图。
3) 堆栈图(6种):二维堆栈柱状图、三维堆栈柱状图、二维堆栈块图、二维堆栈条形图、三维堆栈条形图、二维堆栈多序列柱状图(除最后一个图,其他的图数据可共享)
4) 联合系列(7种):(单一系列的图形可以联合使用,在一张图表中显示)
5) 点分布图(2种):(主要用来描述事件发生的分布情况,数据格式结构可共用)点状图、气泡状图。
6) 带滚动条系列(6种):多序列图(包括二维柱状图、二维线图、二维块图)、二维堆状柱状图、二维联合图、二维联合双Y轴图。
7) Grid形式(1种):SSGrid.swf用法同上,可以结合上面的图形,一起使用。注意:grid的形式只支持单一系列图表的数据。
二、XML数据文件
1. XML文件以 <chart>开头,以</chart>结束;或者以<graph>开头,以</graph>结束
2. 属性:(详细见附注)XML标签属性有以下四种数据类型:布尔型、数字型、字符型、十六进制颜色代码(只支持十六进制的颜色表示,且去掉前面的#号)
3. 注意点:
1) 当数字前缀numberPrefix为€、£、₣、¥、¢、%使用dataURL时可直接使用,但是当使用dataXML时需进行相应的编码即%E2%82%AC、%A3、%E2%82%A3、%A5、%A2、%25。
2) 当标题caption含有&在dataXML中要被编码为%26。
3) Fusioncharts不支持<、>号,需编码成<、>
4) 当需要显示“’”时(eg: John’s)使用dataURL时需被编译成'使用dataXML时需被编译成%26apos;
5) 当数据不连续时可以使用connectNullData属性设置是否让其连续显示(不连续点的直接用直线相连,也可以再不连续点的前一属性中设置dashed='1'可以用虚线链接不连续点)
三、HTML(当然也可以使用JSP)嵌入charts文件
1、不使用JS情况:(不推荐使用)
使用<object>和<embed>嵌入swf文件,并设置&dataUrl=data.xml的路径
2、使用JS情况:(推荐使用这种方法嵌入Charts文件)
1) 必须包含fusioncharts.js文件
2) new FusionCharts(“swf”,”id”,”width”,”height”,”debugmodel”,”registerwithjs”)创建一个fusioncharts对象
3) 用这个对象的setDataURL方法包含data.xml文件或者用这个对象的setDataXML方法包含数据源的xml字符串
四、结合javascript的应用:
1. 前提:置FusionCharts中的registerwithjs为1
2. 事件:
1) FC_Loaded(DOMId):描述当SWF文件在客户端已经完成下载
2) FC_Rendered(DOMId):
3) FC_DataRendered(DOMId):描述当图表数据已经下载到dataxml或者dataURL
4) FC_DataLoadError(DOMId):描述当从特定的URL下载数据发生错误
5) FC_NoDataToDisplay(DOMId):描述当下载的xml文件里没有可显示的数据
6) FC_DataXMLInvalid(DOMId):描述xml格式错误
3. 方法
1) setDataXML(strDataXML:string):改变图表的数据
2) setDataURL(strDataURL:string):同上
3) print():打印图表
4) getXML():返回图表的xml数据
5) getChartAttribute(attrNamr:string):返回xml <chart>标记的属性
6) hasRendered():布尔型,标志图表是否已经呈现成功
7) getDataAsCSV():返回图表的数据位CSV字符型
8) 关于3D图表方面的方法在后面的属性里面有讲
五、热点链接:link=’ ’
四种链接方式:
1. 链接到同一个窗口:link='指定页面%3F参数'
2. 链接到新的窗口:link='n-指定页面%3F参数'
3. 链接到一个指定的frame:link='F-FrameName-指定页面%3F参数'(注参数一般不能超过两个,当超过两个则必须追加为一个字符串用逗号分隔)
4. 链接到一个弹出框:link="P-detailsWin,width=400,height=300,toolbar=no,scrollbars=no, resizable=no-ShowDetails.asp%3FMonth%3DJan"
5. 整个图表链接:clickURL='指定路径'
6. 链接到Js :link="j-function()"
7. Click 事件处理:link='S-parameter'(此方法是整个图表的链接情况)
六、图表数据导出
1. 使用context menu:设置属性showExportDataMenuItem='1',并可以通过exportDataMenuItemLabel=” ”设置导出标签的名称。这样就可以把图表中的数据复制到剪贴板上了,然后打开记事本之类的东东就可以把数据粘贴到上面去了。
2. 使用JavaScript Menu:首先置registerWithJS为1,即var chart1 = new FusionCharts("http://www.cnblogs.com/FusionCharts/Column3D.swf", "chart1Id", "400", "300", "0", "1")。然后根据charts节点id获得一个对象,使用var chartObj = getChartFromId("chart1Id")方法。最后从这个对象取出图表里的数据,使用chartObj.getDataAsCSV( ),然后就可以进行你需要的处理了
七、图表导出为pdf或者图片(JPEG和PNG)形式
1、服务器端图表导出
1) 把jar包Builderpath到web app libraries下面
2) 把classes文件发布到web-info下面
3) 在data.xml文件里加入exportEnabled='1'(允许导出)、exportHandler='JSP/FCExporter.jsp'(即处理导出的路径,注意:默认是在跟data.xml在同一个跟目录下面)、还可以设置exportAction(选择导出的图片会到客户端作为下载还是直接保存到服务器)、exportAtClient(选择是选择客户端导出还是选择服务器端导出)等属性
4) 把FCExporter.jsp、FCExporterError.jsp放在web工程下面(注意:FCExporter.jsp里WEB_ROOT_PATH的路径,默认情况是Resources文件直接放在web工程下的,若将Resources文件放在其他文件包下面时注意修改WEB_ROOT_PATH路径
5) 处理流程:data.xml中指明exportHandler路径。触发导出时转向exportHandler所指向的路径FCExporter.jsp,在FCExporter.jsp中调用FusionChartsExportHelper.class中的HttpServletRequest类将data.xml中的数据以流的形式传进来,将charts的宽度、高度、颜色、domid作为元数据传入。并且根据选择是导出pdf还是图片导向resource下面的不同页面路径。(导出时会遇到数据传入的数据为空的情况,推荐使用客户端图表导出的方法)
2、客户端图表导出
1) 包含FusionChartsExportComponent.js文件
2) 包含FCExporter.swf文件
3) 设置xml文件里的一下属性:exportEnabled='1'(允许导出) exportAtClient='1'(客户端导出方式)exportHandler='fcExporter1'(处理导出)
4) Html文件里加入
<div id="fcexpDiv" align="center">FusionCharts Export Handler Component</div>
<script type="text/javascript">
Var myExportComponent = new FusionChartsExportObject("fcExporter1", "http://www.cnblogs.com/FusionCharts/FCExporter.swf");
myExportComponent.Render("fcexpDiv");
</script>
3、批图表导出处理:
1) 前提:要批导出的数据共用一个xml文件,即共用数据。
2) 与单个导出的不同之处:
Ø myExportComponent.sourceCharts = ['myChartId1','myChartId2','myChartId3'];
Ø 用sourceCharts方法包含需导出的所以图表DOMid
Ø 设置导出图片相关的属性:componentAttributes。
八、中文编码解决方法:
提供字符串数据源的页面必须硬编码才行,可以是GBK或UTF-8。
1、动态产生的XML文档,即使用dataURL方法加载的数据,编码须是GBK或者gb2312。做法:只需在包含数据源的jsp页面加入<%@ page language="java" contentType="text/xml; charset=GBK"%>
2、提供字符串数据源(即使用dataXML方法加载的数据)的页面必须硬编码才行,可以是GBK或UTF-8。做法:只需在包含xml的jsp页面加入<%@ page language="java" contentType="text/html; charset=UTF-8"%>
附注fusionCharts详细属性:
按照模块分类:
1、边框及整个背景的属性:
属性名称 |
属性说明 |
示例或说明 |
bgColor |
背景颜色 |
bgColor='999999,FFFFF渐变 bgColor=’999999’单色 |
bgAlpha |
背景透明度 |
设置范围在1-100 |
showBorder |
图表外是否显示边框 |
默认二维图表显示,三维不显示 |
borderColor |
边框颜色 |
十六进制表示去掉前面的#号 |
borderThickness |
边框线的粗细 |
像素表示 |
borderAlpha |
边框透明度 |
|
bgSWF |
背景图片或动画 |
保证此图片和SWF文件在同一个文件夹 |
bgSWFAlpha |
设置背景图片的透明度 |
2、图表背景属性:
属性名称 |
属性说明 |
示例或说明 |
canvasbgColor |
图表背景颜色 |
可设置单色也可以使用梯度设置渐变色 |
canvasbgAlpha |
图表背景透明度 |
|
canvasBorderColor |
图表背景边框颜色 |
|
canvasBorderThickness |
图表背景边框线粗细 |
|
canvasBorderAlpha |
图表背景边框透明度 |
3、外部引入LOGO:
属性名称 |
属性说明 |
示例或说明 |
logoURL |
LOGO引入的地址 |
logoURL='logo_fc.gif' |
logoPosition |
LOGO在图表中的位置 |
TL – 左上TR –右上BL – 左下BR –右下CC – 中间 |
logoAlpha |
LOGO的透明度 |
|
logoScale |
LOGO比例 |
4、图表名称和轴属性:
属性名称 |
属性说明 |
示例或说明 |
caption |
标题 |
|
subcaption |
子标题 |
|
xAxisName |
X轴名称 |
|
yAxisName |
Y轴名称 |
|
rotateYAxisName |
Y轴名称是否旋转的显示 |
|
outCnvbaseFont |
Canvas外面的字体 |
即标题、子标题、X/Y轴名称字体 |
outCnvbaseFontSize |
Canvas外面的字体大小 |
范围在0-72 |
outCnvbaseFontColor |
Canvas外面的字体颜色 |
|
baseFont |
Canvas里面的字体 |
|
baseFontSize |
Canvas里面的字体大小 |
|
baseFontColor |
Canvas里面的字体颜色 |
5、data plot属性
plotGradientColor |
取消梯度颜色 |
plotGradientColor='' |
指明渐变是明度还是灰度(默认为明度,即加白色渐变) |
plotGradientColor='333333' |
|
showPlotBorder |
是否显示数据块的边框 |
柱状图是否显示外框 |
plotBorderDashed |
数据块的边框是否虚线显示 |
|
useRoundEdges |
对于柱状图是否使用圆角 |
并且加入了glass效果 |
plotFillAngle |
使用梯度颜色时,选择梯度角度 |
|
plotFillAlpha |
使用梯度颜色时,选择透明度 |
6、数据横纵轴属性
showLabels |
是否显示X轴标签名称 |
默认显示 |
showYAxisValues |
是否显示Y轴标签名称 |
默认显示 |
labelDisplay |
标签显示格式 |
WRAP(重叠)ROTATE(旋转)Stagger(交错) |
slantLabels |
标签旋转显示时的倾斜角度 |
|
staggerLines |
标签交错显示时的交错行数 |
|
labelStep |
横轴标签隔几个显示 |
|
yAxisValuesStep |
纵轴标签隔几个显示 |
7、图表上的数据显示
showValues |
是否显示图表上的数据 |
默认显示 |
displayValue |
自定义图表上显示的内容 |
|
rotateValues |
是否旋转90度显示图表上的数据 |
|
placeValuesInside |
是否在图表内部显示数据 |
8、图表调色板
palette |
图表块框框的渐变程度 |
1-5可供选择 |
paletteColors |
图表块里面的渐变颜色 |
paletteColors='FF5904,0372AB,FF0000' |
9、横轴坐标最大值、最小值属性
yAxisMinValue |
Y轴坐标的最小值 |
|
yAxisMaxValue |
Y轴坐标的最大值 |
|
xAxisMinValue |
X轴坐标的最小值 |
|
xAxisMaxValue |
X轴坐标的最大值 |
10、图表内部的div线相关属性
divLineColor |
设置div的颜色 |
|
divLineThickness |
设置div的线条粗细 |
1-5 |
divLineAlpha |
设置div的线条透明度 |
1-100 |
divLineIsDashed |
设置div是否虚线显示 |
|
showAlternateHGridColor |
设置div块是否高亮显示 |
11、图表内部垂直div线的相关属性
vDivLineColor |
设置垂直div的颜色 |
|
vDivLineThickness |
设置垂直div的线条粗细 |
|
vDivLineAlpha |
设置垂直div的线条透明度 |
|
vDivLineIsDashed |
设置垂直div是否虚线显示 |
|
showAlternateVGridColor |
设置垂直div块是否高亮显示 |
alternateVGridAlpha (透明度) |
alternateVGridColor (颜色) |
12、Zero plan相关属性
zeroPlaneColor |
设置零线(面)的颜色 |
|
zeroPlaneThickness |
设置零线(面)的粗细 |
|
zeroPlaneAlpha |
设置零线(面)的透明度 |
|
zeroPlaneShowBorder |
是否显示零面的外框 |
只针对3D图表 |
zeroPlaneBorderColor |
设置零面外框的颜色 |
只针对3D图表 |
13、Anchors相关属性(针对线图)
drawAnchors |
是否显示线图的Anchors |
默认显示 |
anchorSides |
设置Anchors是几边形 |
3-20 |
anchorRadius |
设置Anchors的大小 |
|
anchorBorderColor |
设置Anchors外框颜色 |
|
anchorBorderThickness |
设置Anchors外框线条粗细 |
|
anchorBgColor |
设置Anchors里面的颜色 |
|
anchorAlpha |
设置Anchors整体的透明度 |
1-100 |
anchorBgAlpha |
设置Anchors所处背景的透明度 |
1-100 |
14、tool-tip属性
showToolTip |
鼠标放上去是否显示提示 |
Set属性里可自定义设置toolText |
toolText |
自定义提示框显示的内容 |
|
toolTipBorderColor |
提示框边框的颜色 |
|
toolTipBgColor |
提示框背景颜色 |
15、padding属性
chartLeftMargin |
纵轴标题离外边框的距离 |
|
chartRightMargin |
Canvas右边线离外边框的距离 |
|
chartTopMargin |
标题离外边框的距离 |
|
chartBottomMargin |
横轴标题离外边框的距离 |
|
captionPadding |
Canvas上边线离图表标题的距离 |
|
xAxisNamePadding |
横坐标离横轴标题的距离 |
|
yAxisNamePadding |
纵坐标离纵轴标题的距离 |
|
yAxisValuesPadding |
Canvas左边线离纵坐标标签的距离 |
|
labelPadding |
Canvas下边线横坐标标签的距离 |
|
valuePadding |
图表上面的数据里图表的距离 |
|
canvasPadding |
Canvas左边线离第一个Anchor的距离 |
只限于线图和块图 |
16、数据格式相关属性
decimals |
设置小数点后面保留的位数 |
|
forceDecimals |
是否强制保留小数点后面的decimals设置的位数 |
|
formatNumberScale |
是否按默认的数据格式显示 |
|
decimalSeparator |
小数点的分隔表示方式 |
默认‘.’ |
thousandSeparator |
千分位的分隔表示方式 |
默认‘,’ |
numberScaleValue |
两个联合一起使用,定义数据标度 |
numberScaleValue='1000,1000,1000' |
numberScaleUnit |
numberScaleUnit='K,M,B' |
|
numberPrefix |
数字显示的前缀 |
numberPrefix='$' |
numberSuffix |
数字显示的后缀 |
17、legend相关属性
showLegend |
是否显示图例说明 |
默认显示 |
legendPosition |
设置图例说明的位置 |
|
legendBgColor |
设置图例说明的背景颜色 |
|
legendBgAlpha |
设置图例说明的背景透明度 |
|
legendBorderColor |
设置图例说明的边框颜色 |
|
legendBorderThickness |
设置图例说明的边框粗细 |
|
legendBorderAlpha |
设置图例说明的边框透明度 |
|
legendShadow |
是否显示为图例说明显示阴影 |
|
legendScrollBgColor |
设置图例说明滚动条的背景颜色 |
当图例说明中有很多事件时 |
legendScrollBarColor |
设置图例说明滚动条的颜色 |
当图例说明中有很多事件时 |
egendScrollBtnColor |
设置图例说明滚动条的按钮的颜色 |
当图例说明中有很多事件时 |
18、3D图表属性
view2D() |
以二维的形式显示 |
3D图表已有的方法接口 |
view3D() |
以三维的形式显示 |
3D图表已有的方法接口 |
resetView() |
重置,恢复到原先的角度 |
3D图表已有的方法接口 |
rotateView(x,y) |
旋转到所选的角度 |
3D图表已有的方法接口 |
getViewAngles() |
获得当前图表所处的横纵角度 |
var a=getViewAngles(); alert(a.xAng); alert(a.yAng); |
cameraAngX |
设置图表角度(横轴角度) |
0 to 360/0 to -360默认为30度 |
cameraAngY |
设置图表角度(纵轴角度) |
0 to 360/0 to -360默认为-45度 |
startAngX |
设置图表开始的角度(横轴角度) |
0 to 360/0 to -360 |
endAngX |
设置图表结束的角度(横轴角度) |
0 to 360/0 to -360 |
startAngY |
设置图表开始的角度(纵轴角度) |
0 to 360/0 to -360 |
endAngY |
设置图表结束的角度(纵轴角度) |
0 to 360/0 to -360 |
dynamicShading |
是否设置光源影响 |
|
lightAngX |
设置光源的角度(横轴角度) |
0 to 360/0 to -360 |
lightAngY |
设置光源的角度(纵轴角度) |
0 to 360/0 to -360 |
YZWallDepth |
设置yz面的深度 |
|
ZXWallDepth |
设置zx面的深度 |
|
XYWallDepth |
设置xy面的深度 |
|
clustered |
图表是否嵌入显示 |
默认前后重叠显示 |
19、自定义菜单属性
showAboutMenuItem |
是否显示自定义菜单 |
默认显示 |
aboutMenuItemLabel |
设置自定义菜单的名称 |
aboutMenuItemLabel ='About My Company' |
aboutMenuItemLink |
设置自定义菜单的链接 |
aboutMenuItemLink='n-http://www.youshang.com |
20、趋势线:
<trendLines>
<line startValue='430000' endValue='450000' color='009933' displayvalue='Target' dashed='1' dashLen='2' dashGap='2' valueOnRight ='1' />
</trendLines>
21、Styles属性:(eg)定义自定义效果属性,然后在一个对象上进行使用。
1、定义一个styles。<definition></ definition>部分定义。基本属性有name(给type所定义的style取的名字)、type(FusionCharts只支持下面六种styles: Font(字体)、Animation(动画)、Shadow(阴影)、Glow(轮廓线)、Blur(模糊化)、Bevel(产生透视,增强立体感))。
2、作用于一个对象。< application></ application>定义。
3、对应关系
作用对象 |
对象说明 |
可以应用的style属性 |
Animation Parameters Supported |
BACKGROUND |
图表所处的整个背景 |
Animation Shadow Glow Bevel Blur |
_alpha _x _y _xScale _yScale |
CANVAS |
单指图表填充的位置 |
Animation Shadow Glow Bevel Blur |
_alpha _x _y _xScale _yScale |
CAPTION |
图表的标题 |
Animation Font Shadow Glow Bevel Blur |
_alpha _x _y |
DATALABELS |
图表X轴标签名称 |
Animation Font Shadow Glow Bevel Blur |
_alpha _x _y |
DATAPLOT |
组成图表的数据块 |
Animation Shadow Glow Bevel Blur |
_alpha _x _y _xScale _yScale |
DATAVALUES |
图表的数据 |
Animation Font Shadow Glow Bevel Blur |
_alpha _x _y |
DIVLINES |
图表背景水平或者垂直的div线 |
Animation Shadow Glow Bevel Blur |
_alpha _y _yScale |
HGRID |
连续的div线之间的颜色块 |
Animation Shadow Glow Bevel Blur |
_alpha _y _xScale _yScale |
SUBCAPTION |
图表的二级标题 |
Animation Font Shadow Glow Bevel Blur |
_alpha _x _y |
TOOLTIP |
当鼠标点在图标上时出现的提示框 |
Font |
|
TRENDLINES |
趋势线 |
Animation Shadow Glow Bevel Blur |
_alpha _y _xScale _yScale |
TRENDVALUES |
趋势线的值 |
Animation Font Shadow Glow Bevel Blur |
_alpha _x _y |
VLINES |
垂直分隔线 |
Animation Shadow Glow Bevel Blur |
_alpha _x _y _yScale |
XAXISNAME |
X轴的名称 |
Animation Font Shadow Glow Bevel Blur |
_alpha _x _y |
YAXISNAME |
Y轴名称 |
Animation Font Shadow Glow Bevel Blur |
_alpha _x _y |
YAXISVALUES |
Y轴数据标度 |
Animation Font Shadow Glow Bevel Blur |
_alpha _x _y _rotation |
<styles>
<definition>
<style name='Anim1' type='animation' param='_xScale' start='0' duration='1' />
<style name='Anim2' type='animation' param='_alpha' start='0' duration='1' />
</definition>
<application>
<apply toObject='TRENDLINES' styles='Anim1, Anim2' />
</application>
</styles>
按照编程xml构造结构分:(只列举出了几种主要属性,主要用于xmlBuiler)
头部属性:
属性名称 |
属性说明 |
示例或者说明 |
Caption |
图表标题 |
还有一个子标题的属性subcaption |
DecimPecision |
自定义小数点的格式 |
默认为‘.’ |
thousandSeparator |
自定义千位的格式 |
默认为‘,’ |
baseFont |
Canvas里面的字体 |
|
baseFontSize |
Canvas里面的字体大小 |
|
xAxisName |
X轴名称 |
|
yAxisName |
Y轴名称 |
|
chartTopMargin |
见上面的距离相关属性的截图 |
设置图表上边距 |
chartBottomMargin |
见上面的距离相关属性的截图 |
设置图表下边距 |
chartLeftMargin |
见上面的距离相关属性的截图 |
设置图表左边距 |
chartRightMargin |
见上面的距离相关属性的截图 |
设置图表右边距 |
canvasBgColor |
设置canvas的背景色 |
既可以是单色也可以设置渐变色 |
canvasBgAlpha |
设置canvas的透明度 |
|
canvasBaseColor |
设置canvas基部的颜色 |
|
divLineColor |
设置水平分隔线的颜色 |
|
bgColor |
Background的背景颜色 |
|
showValues |
是否显示图表表示的数据 |
|
showBorder |
是否显示图表外的边框 |
默认二维图表显示,三维不显示 |
formatNumber |
千位是否需要逗号隔开 |
默认自动使用逗号分开 |
formatNumberScale |
数据是否自动转换为k/m格式 |
默认自动转换 |
Body属性:<set里面设置的属性
属性名称 |
属性说明 |
示例或者说明 |
Label |
设置在图表中横轴标示的名字 |
Name也可以 |
value |
设置在图表中各个名字想对应的值 |
|
color |
设置在图表中相对应的柱行图的颜色 |
|
toolText |
设置鼠标旋停在相对应的柱行图上出现的文本内容 |
hoverText也具有此功能 |
link |
设置该柱行图的链接地址 |
|
alpha |
设置在图表中相对应的柱行图的透明度 |
|
showName |
设置在是否显示图表中相对应的柱行图的name |