FusionCharts使用教程一：如何为FusionCharts图表设置背景图片

FusionCharts 可允许您为图表设置背景图片。你可以嵌入GIF, JPEG 或者PNG格式的背景图片，SWF文件或者数据表作为背景。要嵌入图像，你所需要做的就是设置<chart> 元素的bgSWF属性，如下图所示。你也可以使用bgSWFAlpha属性，动态更改所加载图像的透明度(0-100值)。

<chart caption='Sales Figures' labelDisplay='NONE' bgSWF='ChartBg.jpg' canvasBgAlpha='30'
canvasBorderColor='333333' canvasBorderThickness='0' divLineColor='333333'>
<set label='John' value='420' />
<set label='Mary' value='295' />
<set label='Tom' value='523' />
<styles>
<definition>
<style name='myFont' type='font' isHTML='1' bold='1' size='11' color='FFFFFF' />
<style name='myShadow' type='shadow' color='333333' angle='45' strength='3'/>
</definition>
<application>
<apply toObject='YAxisValues' styles='myFont,myShadow' />
<apply toObject='DataLabels' styles='myFont,myShadow' />
<apply toObject='DataValues' styles='myFont,myShadow' />
<apply toObject='Caption' styles='myFont,myShadow' />
</application>
</styles>
</chart>

根据以上的代码，我们需要进行如下操作：

1、载入背景图像ChartBg.jpg，将其设置为 bgSWF属性。如果您的图像文件在不同的位置，你需要指定完整的路径。此外，由于安全限制，您的图像文件需要放在相同的子域名中作为SWF文件。

2、canvas alpha设置为30，因此图像可以通过背景显示处理。

3、定义其他图表元素的格式样式

当你查看带有背景图像的图表，会生成下面的图表：

为了生成最佳效果，你需要确保背景图片和图表是相同的尺寸（宽度和高度）。否则，加载的图像将处于图表的左上角。