You are viewing documentation for an older version. For current documentation - click here.
Using FusionCharts Tag

FusionCharts provides an alternative HTML tag based embedding method to create charts into a web page. Using this method, you can embed charts without writing JavaScript code or HTML <OBJECT>/<EMBED> tags.  Using this method all you need to is to use <fusioncharts> tag. You can set all chart configurations and data through this tag.

To implement FusionCharts in this way, you must also include the JavaScript class FusionChartsDOM.js (present in Charts folder) apart from the standard JavaScript class file FusionCharts.js. Following code snippet demonstrates the use of <fusioncharts> tag:

 
<html>
  <head>
    <title>My First chart using FusionCharts - 
           creating chart using fusioncharts tag</title>
    <script type="text/javascript" src="FusionCharts/FusionCharts.js"></script>
    <script type="text/javascript" src="FusionCharts/FusionChartsDOM.js"></script>
  </head>
  <body>
    <fusioncharts chartType="Column3D" dataUrl="Data.xml" width="400" height="300">
    </fusioncharts> 
  </body>
</html>

This method is implemented using a separate framework - FusionCharts DOM. Some features of FusionCharts DOM are:

  • Easy HTML-like chart Inclusion - FusionCharts DOM facilitates the writing of simple HTML-like <fusioncharts> tag instead of complex JavaScript or Object/Embed tags. Yes it is that simple!
  • Inline XML Data Embedding - With FusionCharts DOM, your XML data can be directly provided inside your web pages.
  • Default Chart Parameters Specification - Provide a common set of look-and-feel for all your charts in a document by setting default chart parameters for all your charts.

For complete technical information on using <fusioncharts> tag refer to FusionCharts DOM documentation. Visit FusionCharts DOM online demos from here.