1、Chart配置邊框和背景Background 配置將影響到整個Chart。自定義背景色(Background)：背景色支持完全的自定義。既可以定義成固定單色背景也可定義漸變形式背景。屬性描述示例bgColor設置Chart的背景色。使用十六進制格式表示形式且不帶#號。要設置漸變效果可用逗號隔開兩個顏色，分別表示漸變色的開始顏色和結束顏色。bgColor="647881"bgAlpha設置背景色的透明度。范圍是： 0-100.bgAlpha="40"例如：<chart bgColor='999999,FFFFFF' bgAlpha=&

2、#39;50' .>自定義邊框(Border)：你可以為Chart自定義border。默認情況下，border只在2D Chart中顯示，而3D Chart的border默認是不顯示的。要顯示border需要將Chart的“showBorder”屬性設置為“1”。下面是一個設置了border的Chart。下面表格的屬性可用來控制Chart的border屬性。屬性描述示例showBorder是否顯示邊框。2D Chart默認為1，3D Chart默認為0.showBorder="1"borderColor邊框顏色。borderColor="1D8BD1

3、"borderThickness邊框的寬度，以像素為單位。borderThickness="2"borderAlpha邊框的透明度。borderAlpha="60"例如：<chart . showBorder='1' borderColor='FF0000' borderThickness='2' borderAlpha='50' .> 漸變背景設置：使用漸變背景時，你可以設置漸變的每種顏色的透明度和顯示比例，還可以設置漸變的角度方向。下面的屬性可用來控制漸變效果。屬性

4、描述示例bgColor填充的比較少，至少需要設置2種或以上的顏色，多種顏色用逗號隔開，且必須使用十六進制格式顏色值，不帶#號。bgColor="99CCFF,FFFFFF" or bgColor="FF5904,FFFDDD,FFFFFF"bgAlpha為每一個漸變色指定的透明度，值的個數與bgColor屬性中指定的顏色個數一致，用逗號隔開。bgAlpha="40,100" or bgAlpha="100,60,100"bgRatio每種顏色漸變的百分比。總的百分比的和必須是100。bgRatio="40

5、,60"bgAngle漸變色的填充角度 (角度： 0-360).bgAngle="180"圖片或SWF文件背景：可為Chart指定圖片（只能是：GIF,JPEG or PNG）或SWF文件作為背景。設置可以指定背景是拉升（stretch）還是平鋪（tile）顯示，水平或垂直對齊等。圖片的大小比例也可指定。下面是一個設置圖片背景的Chart要設置背景圖片，你只需要設置<chart>元素的<bgImage>屬性即可，如下：<chart bgImage='pizza.jpg' > .</chart>以上Ch

6、art完整的XML文件如下：<chart caption='Pizza Mania' subcaption='Consumption' bgImage='pizza.jpg' canvasBorderAlpha='0' canvasbgAlpha='0' numDivlines='0' showYAxisValues='0' numberPrefix='' paletteColors='880000' plotgradientcolor='

7、;fba71a' showLabels='0' placevaluesinside='1' showplotBorder='0' plotfillalpha='90,90' > <set label='Joel' value='900' displayValue=' Joel'/> <set label='Tyler' value='500' displayValue=' Tyler'/> <

8、set label='Clarke' value='700' displayValue=' Clarke'/> <set label='Pablo' value='1000' displayValue=' Pablo'/> <set label='Carl' value='500' displayValue=' Carl'/> <set label='Regina' value='200

9、9; displayValue=' Regina'/> <set label='Craig' value='400' displayValue=' Craig' /> <styles> <definition> <style name='myAnimation' type='animation' DURATION='3' easing='bounce' start='0' param='_xsca

10、le'/> <style name='myFont' type='font' color='ffffff'/> <style name='myFontCaption' type='font' size='18' color='ffffff' /> <style name='myFontSubCaption' type='font' size='12' color='ffffff'

11、;/> <style name='myShadow' type='shadow' color='333333' angle='45' strength='3'/> </definition> <application> <apply toObject='Dataplot' styles='myAnimation'/> <apply toObject='Datavalues' styles='myFon

12、t,myShadow'/> <apply toObject='caption' styles='myFontCaption,myShadow'/> <apply toObject='subcaption' styles='myFontSubCaption,myShadow'/> </application> </styles></chart>在上面的代碼中，我們：Ø 通過設置bgImage屬性設置了背景圖片pizza.jpg，如果你的圖片和XML不

13、在同一個位置，則需要指定相對路徑。Ø 設置了畫布(cancas)的透明度使圖片完全顯示出來。Ø 為其他的Chart元素定義了樣式。簡單、有效，不是嗎？你可以通過bgImageAlpha 屬性設置背景圖片的透明度，它的默認值為'100'，100表示完全不透明，0表示完全透明。下面例子中設置背景圖片的透明度為30%：<chart bgImageAlpha='30' bgImage='pizza.jpg' >   .</chart>在上面的代碼中，我們添加了bgImageAlpha=

14、9;30' 屬性，顯示的效果如下：你也可以將背景圖片放大或縮小。要配置顯示的比例，可使用bgImageScale屬性，它的取值范圍是0-300，默認為100，小于100意味著縮小，大于100則放大。在下面的例子中我們將顯示比例設置為50。因此，背景圖片將只有原來的一半大。<chart caption='Sales Figures' bgImageAlpha='30' bgImage='pizza.jpg' bgImageScale='50' >   .</chart>顯示效果如下

15、：你可以通過設置背景圖片的水平或垂直對齊方式來改變背景圖片的位置。bgImageVAlign (top, middle, bottom) and bgImageHAlign (left, middle, right)可分別用來設置垂直和水平對齊方式。默認為“左上角”對齊，即： bgImageVAlign='top' and bgImageHALign='left'。下面展現了水平和垂直對齊的所有可能的組合：背景圖片可以按任何一種顯示模式顯示。可通過 bgImageDisplayMode 屬性設置顯示模式。模式的可

16、選值有：none, center, stretch, tile, fit 和 fill。默認顯示模式為none。下面展現不同顯示模式的效果：none  背景圖片將顯示在左上角(默認模式)Center  圖片在Chart背景的中央。Stretch  圖片拉升填充整個Chart區域，不保持縱橫比。Tile  圖片重復平鋪在Chart區域。Fit  根據Chart區域按比例拉升背景圖片，保持縱橫比，可能不會填滿Chart區域。Fill  填滿整個Chart區域，保持縱橫比。多余的圖

17、片將溢出(被裁減)。注意: 背景對齊的屬性在center和stretch模式下將被忽略，并且bgImageScale 屬性只在none、center和tile顯示模式下才有效。上面討論的屬性總結如下：屬性描述示例bgImage指定背景image / SWF文件的位置。必須指定相對路徑，絕對路徑將被忽略。bgImage="FruitsPic.jpg"bgImageAlpha配置背景的透明度。取值范圍0-1000：完全透明100：完全不透明bgImageAlpha="40"bgImageValignSince v3.2.2設置背景圖片的垂直對齊方式：top：頂部對齊middle：居中對齊bottom：底部對齊bgImageVAlign="bottom"bgImageHalignSince v3.2.2設置背景圖片的水平對齊方式：Left：左對齊middle：居中對齊right：右對齊bgImageHAlign="left"bgImageDisplayModeSince