通過前面兩章的講解我們可以制作出簡單的圖像，但是有時候我們需要對圖像進行一個精確的規划，比如設置背景顏色、設置提示信息、設置間隔顏色等等，這時就需要我們對FusionCharts的細節有比較詳細的了解，只有了解了這些最基本的元素才能制作出我們想要的圖像。
FusionCharts的基本元素主要包括如下幾個方面：圖像背景和畫布、圖形標簽、刻度線標簽、提示信息、數據。
一、圖像背景和畫布。
這個標簽類主要是用於設置圖像的背景、邊框和對整個畫布進行設置。
| 屬性名稱 |
屬性說明 |
示例或說明 |
| bgColor |
背景顏色 |
bgColor='999999,FFFFF漸變 bgColor=’999999’ 單色 |
| bgAlpha |
背景透明度 |
設置范圍在1-100 |
| showBorder |
圖表外是否顯示邊框 |
默認二維圖表顯示，三維不顯示 |
| borderColor |
邊框顏色 |
十六進制表示去掉前面的#號 |
| borderThickness |
邊框線的粗細 |
像素表示 |
| borderAlpha |
邊框透明度 |
|
| bgSWF |
背景圖片或動畫 |
保證此圖片和SWF文件在同一個文件夾 |
| bgSWFAlpha |
設置背景圖片的透明度 |
| 屬性名稱 |
屬性說明 |
示例或說明 |
| canvasbgColor |
圖表背景顏色 |
可設置單色也可以使用梯度設置漸變色 |
| canvasbgAlpha |
圖表背景透明度 |
設置范圍在1-100 |
| canvasBorderColor |
圖表背景邊框顏色 |
|
| canvasBorderThickness |
圖表背景邊框線粗細 |
|
| canvasBorderAlpha |
圖表背景邊框透明度 |
對於透明度而已，它會隨着值的變大而越不明顯。下面是透明度為100和60的比較(注意邊框的變化)，
二、圖形標簽
圖形標簽主要是用於表現圖像的數據軸、名稱、字體等等及其相關的屬性的設置。
2.1圖表名稱
通過圖表的名稱屬性我們可以設置圖形的名稱、子名稱、X、Y軸的名稱。
| 屬性名稱 |
屬性說明 |
示例或說明 |
| caption |
標題 |
|
| subcaption |
子標題 |
|
| xAxisName |
X軸名稱 |
|
| yAxisName |
Y軸名稱 |
|
| rotateYAxisName |
Y軸名稱是否旋轉的顯示 |
|
| rotateNames |
X軸名稱是否旋轉的顯示 |
slantLabels=’1’時，斜45度，否則斜90度豎排 |
2.2字體屬性
| 屬性名稱 |
屬性說明 |
示例或說明 |
| outCnvbaseFont |
Canvas外面的字體 |
即標題、子標題、X/Y軸名稱字體 |
| outCnvbaseFontSize |
Canvas外面的字體大小 |
范圍在0-72 |
| outCnvbaseFontColor |
Canvas外面的字體顏色 |
|
| baseFont |
Canvas里面的字體 |
|
| baseFontSize |
Canvas里面的字體大小 |
|
| baseFontColor |
Canvas里面的字體顏色 |
2.3數據軸屬性
| 屬性名稱 |
屬性說明 |
示例或說明 |
| showLabels |
是否顯示X軸標簽名稱 |
默認顯示 |
| showYAxisValues |
是否顯示Y軸標簽名稱 |
默認顯示 |
| numberPrefix |
Y軸數據加上前綴 |
如numberPrefix = ‘a’ |
| numberSuffix |
Y軸數據加上后綴 |
如numberPrefix = ‘b’ |
| formatNumberScale |
是否格式化數字,默認為1(True),自動的給你的數字加上K（千）或M（百萬）；若取0,則不加K或M |
formatNumberScale=’0’即可去除掉這個’k’ |
| labelDisplay |
標簽顯示格式 |
WRAP（重疊）ROTATE（旋轉）Stagger（交錯） |
| slantLabels |
標簽旋轉顯示時的傾斜角度 |
|
| staggerLines |
標簽交錯顯示時的交錯行數 |
|
| labelStep |
橫軸標簽隔幾個顯示 |
|
| yAxisValuesStep |
縱軸標簽隔幾個顯示 |
|
| yAxisMinValue |
Y軸坐標的最小值 |
|
| yAxisMaxValue |
Y軸坐標的最大值 |
|
| xAxisMinValue |
X軸坐標的最小值 |
|
| xAxisMaxValue |
X軸坐標的最大值 |
2.4圖例相關屬性
| 屬性名稱 |
屬性說明 |
示例或說明 |
| showLegend |
是否顯示圖例說明 |
默認顯示 |
| legendPosition |
設置圖例說明的位置 |
|
| legendBgColor |
設置圖例說明的背景顏色 |
|
| legendBgAlpha |
設置圖例說明的背景透明度 |
|
| legendBorderColor |
設置圖例說明的邊框顏色 |
|
| legendBorderThickness |
設置圖例說明的邊框粗細 |
|
| legendBorderAlpha |
設置圖例說明的邊框透明度 |
|
| legendShadow |
是否顯示為圖例說明顯示陰影 |
|
| legendScrollBgColor |
設置圖例說明滾動條的背景顏色 |
當圖例說明中有很多事件時 |
| legendScrollBarColor |
設置圖例說明滾動條的顏色 |
當圖例說明中有很多事件時 |
| egendScrollBtnColor |
設置圖例說明滾動條的按鈕的顏色 |
當圖例說明中有很多事件時 |
2.53D圖表屬性
| 屬性名稱 |
屬性說明 |
示例或說明 |
| 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 |
圖表是否嵌入顯示 |
默認前后重疊顯示 |
三、刻度線
在刻度線標簽中我們可以設置零平面、刻度線和趨勢線。
3.1零平面
| 屬性名稱 |
屬性說明 |
示例或說明 |
| zeroPlaneColor |
設置零線（面）的顏色 |
|
| zeroPlaneThickness |
設置零線（面）的粗細 |
|
| zeroPlaneAlpha |
設置零線（面）的透明度 |
|
| zeroPlaneShowBorder |
是否顯示零面的外框 |
只針對3D圖表 |
| zeroPlaneBorderColor |
設置零面外框的顏色 |
只針對3D圖表 |
3.2刻度線
| 屬性名稱 |
屬性說明 |
示例或說明 |
| divLineColor |
設置div的顏色 |
|
| divLineThickness |
設置div的線條粗細 |
1-5 |
| divLineAlpha |
設置div的線條透明度 |
1-100 |
| divLineIsDashed |
設置div是否虛線顯示 |
|
| showAlternateHGridColor |
設置div塊是否高亮顯示 |
|
| vDivLineColor |
設置垂直div的顏色 |
|
| vDivLineThickness |
設置垂直div的線條粗細 |
|
| vDivLineAlpha |
設置垂直div的線條透明度 |
|
| vDivLineIsDashed |
設置垂直div是否虛線顯示 |
|
| showAlternateVGridColor |
設置垂直div塊是否高亮顯示 |
alternateVGridAlpha (透明度) |
上面圖像將零平面顏色設置為綠色、刻度線顏色為白色、粗細為1、虛線顯示(如果虛線實現，粗細最好<=2否則就不清晰)。
3.3趨勢線
| 屬性名稱 |
屬性說明 |
示例或說明 |
| dashed |
是否虛線顯示 |
默認實線顯示 |
| dashLen |
設置虛線長度 |
|
| dashGap |
設置虛線間隙寬度 |
|
| startValue |
起始值 |
單個時一條橫線，有結束值時，兩點連線 |
| endValue |
結束值 |
|
| displayvalue |
線標示 |
|
| valueOnRight |
設置displayvalue顯示右邊 |
valueOnRight ='1' |
| color |
設置線顏色 |
四、提示信息
當我們將鼠標放在某快數據區域的時候，提示信息就會顯示相應的提示內容，包括數據、所屬“單位”、以及一些用戶設置的信息。通過如下幾個屬性我們定制自己的提示信息。
| 屬性名稱 |
屬性說明 |
示例或說明 |
| showToolTip |
鼠標放上去是否顯示提示 |
Set屬性里可自定義設置toolText |
| toolText |
自定義提示框顯示的內容 |
|
| toolTipBorderColor |
提示框邊框的顏色 |
|
| toolTipBgColor |
提示框背景顏色 |
五、數據格式
| decimals |
設置小數點后面保留的位數 |
|
| forceDecimals |
是否強制保留小數點后面的decimals設置的位數 |
|
| formatNumberScale |
是否按默認的數據格式顯示 |
|
| decimalSeparator |
小數點的分隔表示方式 |
默認‘.’ |
| thousandSeparator |
千分位的分隔表示方式 |
默認‘,’ |
| numberScaleValue |
兩個聯合一起使用，定義數據標度 |
numberScaleValue='1000,1000,1000' |
| numberScaleUnit |
numberScaleUnit='K,M,B' |
|
| numberPrefix |
數字顯示的前綴 |
numberPrefix='$' |
| numberSuffix |
數字顯示的后綴 |