转FusionCharts的分类及属性介绍

一.FusionCharts的分类关于FusionCharts的基本介绍我就不在这里浪费篇幅了，想了解的朋友自己去里面找吧。我就说说FusionCharts的官方四大分类:1.FusionCharts2.FusionMaps3.FusionWidgets4.PowerCharts每种类型我还是贴个图吧(从左到右依次对应):二.关于FusionCharts的FusionCharts大家知道了FusionCharts分类以后，就明白了FusionCharts的FusionCharts吧。之前我们小组研究FusionCharts的时候，这个念法一直都觉得很绕口，现在熟悉了，就好了。其实我们在现有的项目中几乎85%的图形都来至于FusionCharts的FusionCharts，还有5%来至于FusionCharts的FusionWidgets，5%来自FusionCharts的PowerCharts。可能大家会问，我这个什么的什么说法是不是太罗嗦，直接说子类不就行了吗？不知道细心的读者发现没有，上面的综合加起来是95%，其实我们项目中还有的5%的图形是来自于amcharts的amstock。关于amcharts我就不多说了，以后有机会再做个专题吧，以免跑题了。FusionCharts的FusionCharts分类有很多种。按数据类型分类有:1.单组数据类型图表(Single Data Charts)2.多组数据类型图表(Multi-Data Charts)按图的展示类型分类(也是官方分类)有:1.单系列图表(Single Series Charts)2.多系列图表(Multi-Series Charts)3.堆积式图表(Stacked Charts)4.组合图表(Combination Charts)5.分布图(XY Plot Charts)6.滚动图(Scroll Charts)其实我们的项目中通常所说的分类就是按数据类型分类的，这个分类是我们自己在实际工作中总结出来的。而按图形展示来分类是FusionCharts官方文档的分类，是很标准的分类。数据类型分类如图(从左到右依次对应)：图的展示类型分类(从左到右依次对应)：三.关于FusionCharts的FusionCharts的Attributes(属性)关于FusionCharts的FusionCharts中很多不同的图、不同类型的图其实有很多共通的属性，当然也有一些各自特殊的属性。下面我先来给大家介绍这些共通的属性吧。上图为FusionCharts的FusionCharts中Column2D.swf的属性。我将拿此图的属性作为例子讲解，因为此图的属性几乎全部为通用属性。(具体是99%通用还是100%通用这个我还真没有统计过，至少是95%通用吧)。属性的分类就以官方的API文档为准吧：1.Chart:Functional Attributes(功能属性)Titles and Axis Names(标题和坐标抽名字) Charts Cosmetics(图表美容属性)Divisional Lines/Grids(分区线/网格 属性)Tool-tip(工具提示属性)Paddings and Margins(填充和边距属性)2.Data: element(set元素属性)Plot Cosmetics(节点美容属性)3.Others:Number Formatting(数字格式化属性)Font Properties(字体属性)Vertical Lines(垂直线属性)Trend Lines(趋势线属性)。注:细心的读者会发现，我上面列的属性分类和图片上的有点不一致，我来解释一下：Chart的Chart Image和Data的Sample XML Data是链接到图片和数据，不是属性。Chart的Chart Objects是高级对象组合属性，平时也很少使用，这里就暂不做介绍了吧，有机会的话，以后单独写篇文章再给大家讲解。属性的分类先介绍到这里，下面我来详细解释每个属性的用途，但在这之前，我得提一下属性的数据类型。FusionCharts 的 XML标签属性有一下四种数据类型:Boolean - 布尔类型，只能为1或者0。例如：Number - 数字类型，只能为数字。例如：String - 字符串类型，只能为字符串。例如： Hex Color Code - 十六进制颜色代码，前边没有#.例如： 好了，了解了这么多了。下面的就简单了，让我来一一介绍具体的每个属性吧。1.Functional Attributes(功能属性)animation=0/1 (设置图形的显示是否是动画显示)palette=1-5 (5种默认的调色板风格任你选)paletteColors=String (手动设置调色板的颜色paletteColors=FF0000,0372AB,FF5904.)showAboutMenuItem=0/1(在图形上点击右键时是否显示about链接)aboutMenuItemLabel=String(about链接的具体名字)aboutMenuItemLink=String(about链接的具体链接地址)showLabels=0/1(是否显示x轴的坐标值)labelDisplay=WRAP/STAGGER/ROTATE/NONE(x轴坐标值的具体展现形式)rotateLabels=0/1(是否旋转x轴的坐标值)slantLabels=0/1(将x轴坐标值旋转为倾斜的还是完全垂直的)labelStep=1 or above(x轴坐标值的步长，即可以设置隔几个柱子显示一个值)staggerLines=2 or above(如果labelDisplay设置为STAGGER,则此属性是控制一个展示周期)showValues=0/1(是否在图形上显示每根柱子具体的值)rotateValues=0/1(是否旋转图形上显示的柱子的值)placeValuesInside=0/1(图形上柱子的值是否显示在柱子里面)showYAxisValues=0/1(是否显示Y轴的值)showLimits=0/1(是否显示极值)showDivLineValues=0/1(是否在divline处显示值)yAxisValuesStep=1 or above(Y轴值的步长)showShadow=0/1(是否显示阴影)adjustDiv=0/1(是否自动调整divlines)rotateYAxisName=0/1(是否旋转Y轴的名字)yAxisNameWidth=Number(Y轴名字的宽度)clickURL=String(点击的链接地址)defaultAnimation=0/1(是否使用默认动画)yAxisMinValue=Number(Y轴的最小值)yAxisMaxValue=Number(Y轴的最大值)setAdaptiveYMin=0/1(自动设置Y轴的最小值)2.Titles and Axis Names(标题和坐标抽名字)caption=String(主标题名字)subCaption=String(副标题名字)xAxisName=String(X轴名字)yAxisName=String(Y轴名字)3.Charts Cosmetics(图表美容属性)bgColor=Color (图表的背景色)bgAlpha=0-100(背景色的透明度)bgRatio=1-100(如果背景色有两个，该属性设置差异的比例)bgAngle=0-360(转变背景颜色的角度，设置一个倾斜度)bgSWF=String(用做背景的swf路径)bgSWFAlpha=0-100(背景swf的透明度)canvasBgColor=Color(画板背景颜色)canvasBgAlpha=0-100(画板背景透明度)canvasBgRatio=Number(不同画板背景色的比率)canvasBgAngle=Number(画布背景色显示角度)canvasBorderColor=Color(画板边框的颜色)canvasBorderThickness=Number(画板边框的宽度)canvasBorderAlpha=0-100(画板边框的透明度)showBorder=0/1(是否显示图表边框)borderColor=Color(边框颜色)borderThickness=Number(图表边框的粗细)borderAlpha=0-100(边框透明度)showVLineLabelBorder=0/1(是否显示垂直线label的宽度)logoURL=String(在图表上加上logo,logo图片的地址)logoPosition=TL/TR/BL/BR/CC(logo的位置)logoAlpha=0-100(logo的透明度)logoScale=1-300(控制logo放大缩小的倍数)logoLink=String(logo的链接地址)4.Divisional Lines/Grids(分区线/网格 属性)numDivLines=0(水平网格线的数量)divLineColor=Color(网格线颜色)divLineThickness=1-5(网格线粗细)divLineAlpha=0-100(网格线透明度)divLineIsDashed=0/1(网格线是否显示为虚线)divLineDashLen=Number(每个虚线的长度)divLineDashGap=Number(每个虚线间的间隔长度)zeroPlaneColor=Color(0值处网格线颜色)zeroPlaneThickness=Number(0值处网格线粗细)zeroPlaneAlpha=0-100(0值处网格线透明度)showAlternateHGridColor=0/1(是否交替显示网格颜色)alternateHGridColor=Color(水平网格颜色)alternateHGridAlpha=Number(水平网格透明度)5.Tool-tip(工具提示属性)showToolTip=0/1(是否显示气泡提示)toolTipBgColor=Color(气泡提示的背景颜色)toolTipBorderColor=Color(汽包提示的边框颜色)toolTipSepChar=String(气泡提示的分隔符)showToolTipShadow=0/1(是否使气泡提示带有阴影效果)6.Paddings and Margins(填充和边距属性)captionPaddingxAxisNamePadding=Number画板与x轴标题之间的距离yAxisNamePadding=Number(画板与y轴标题之间的距离)yAxisValuesPadding=Number(画板与y轴值之间的距离)labelPadding=Number(画板离label之间的距离)valuePadding=Number(柱子离值之间的距离)plotSpacePercent=0-80(两个bar之间的距离)chartLeftMargin=Number(距左边框的距离)chartRightMargin=Number(距右边框的距离)chartTopMargin=Number(距上边框的距离)chartBottomMargin=Number(距下边框的距离)canvasLeftMargin=Number(画板离左边的距离)canvasRightMargin=Number(画板离右边的距离)canvasTopMargin=Number(画板离上边的距离)canvasBottomMargin=Number(画板离下边的距离)7. element(set元素属性)label=String(具体的标签)value=Number(具体的值)displayValue=String(显示的值)color=Color(该柱子的颜色)link=String(链接地址)toolText=String(气泡提示时显示的值)showLabel=0/1(是否显示标签)showValue=0/1(是否显示此柱子的值)dashed=0/1(柱子的边框是否显示为虚线)alpha=Number(柱子的透明度)8.Plot Cosmetics(节点美容属性)useRoundEdges=0/1(是否显示光滑边缘)showPlotBorder=0/1(是否显示柱子的边框)plotBorderColor=Color(柱子边框的颜色)plotBorderThickness=0-5(柱子边框的厚度)plotBorderAlpha=0-100(柱子边框的透明度)plotBorderDashed=0/1(柱子边框是否显示为虚线)plotBorderDashLen=Number(虚线的长度)plotBorderDashGap=Number(虚线的间隔)plotFillAngle=0-360(数据填充色角度)plotFillRatio=0-100(数据填充色比率)plotFillAlpha=0-100(数据填充色透明度)plotGradientColor=Color(数据的有坡度颜色方案)9.Number Formatting(数字格式化属性)formatNumber=0-1(是否格式化数值)formatNumberScale=0-1(是否对大数值以k,M方式表示)defaultNumberScale=String(默认的数字格式化)numberScaleUnit=String(设置进位规则对应的单位eg:k,m,b)numberScaleValue=String(设置进位的规则eg:1000,1000,1000)numberPrefix=String(数值前缀)numberSuffix=String(数值后缀)decimalSeparator=String(设置小数点的分隔符的表示形式,|.)thousandSeparator=String(设置3位数值之间的分隔符的表示形式,|.)inDecimalSeparator=String(设置小数分隔符)inThousandSeparator=String(设置千位分隔符)decimals=0-10(小数点后保留几位)forceDecimals=0/1(小数点后位数不够的，是否强制补0)yAxisValueDecimals=0-10(y轴值保留几位小数)10.Font Properties(字体属性)baseFont=String(字体)baseFontSize=0-72(字体大小)baseFontColor=Color(字体颜色)outCnvBaseFont=String(画板外的字体)outCnvBaseFontSize=0-72(画板外的字体大小)outCnvBaseFontColor=Color(画板外的字体颜色)11.Vertical Lines(垂直线属性)color=Color(颜色)thickness=Number(厚度)alpha=0-100(透明度)dashed=0/1(是否使用虚线)dashLen=Number(虚线的长度)dashGap=Number(虚线间隔的长度)label=String(此垂直线的名字)showLabelBorder=0/1(是否显示label的边框)linePosition=0/1(line的位置)labelPosition=0/1(label的位置)labelHAlign=left/center/right(水平线label的位置)labelVAlign=top/middle/bottom(垂直线label的位置)12.Trend Lines(趋势线属性)startValue=Number(开始值)endValue=Number(结束值)displayValue=String(显示的值)color=Color(颜色)isTrendZone=0/1(是否显示趋势线)showOnTop=0/1(趋势线是否显示在上面)thickness=Number(趋势线的宽度)alpha=0-100(趋势线的透明度)dashed=0/1(趋势线是否为虚线)dashLen=Number(趋势线虚线的长度)dashGap=Number(虚线之间的间隔长度)valueOnRight=0/1(趋势线的标记是否在右边)toolText=String(趋势线标记的名字)