Time for action — setting currency notes as the chart background

1. 1. Create a copy of ChartBackground.html and ChartBackground.xml, and rename them to ImageBackground.html and ImageBackground.xml respectively. Also make the change in XML data URL.

2. 2. Change the chart type to Column2D.swf in ImageBackground.html using the following line of code:

   var myChart = new FusionCharts("../FusionCharts/Column2D.swf", "myChartId", "400", "300", "0", "1" );
   

3. 3. Find a nice background image with currency notes. You can either search for an image shared under the Creative Commons license at http://search.creativecommons.org/ or use the beautiful image at http://www.flickr.com/photos/amagill/3367543296/sizes/z/in/photostream/. Save it as money.jpg in the CustomizingCharts folder.

4. 4. Add the attribute canvasbgAlpha='0' to the<chart> element, and remove bgColor='CCCCCC'.

5. 5. Add the attributes bgImage='money.jpg' bgImageAlpha='30' bgImageDisplayMode='fit'.

6. 6. Open ImageBackground.html in a browser to see...