jQuery
The FusionCharts Suite XT jQuery helper allows you to use jQuery syntax to render and manipulate your charts and graphs seamlessly across all browsers and devices.
It helps you add interactive JavaScript charts to your web and mobile applications, combining the delight and comprehensiveness of the FusionCharts Suite XT with the easy-to-use jQuery syntax.
You can download the jQuery-FusionCharts component from here .
Set up FusionCharts jQuery Helper
To set up FusionCharts jQuery helper, follow the steps given below:
- Include
jquery.min.js
to enable jQuery in your project:
<script type="text/javascript" src="jquery.min.js"></script>
Import jQuery before including the FusionCharts jQuery helper the project. Note that to support IE 6/7/8, use jQuery 1.x versions.
Copy
fusioncharts.js
andfusioncharts.jqueryplugin.js
from the FusionCharts Download Package > js folder in your project.Add references to the required JavaScript files:
<script type="text/javascript" src="fusioncharts.js"></script>
<script type="text/javascript" src="fusioncharts-jquery-plugin.js"></script>
On top of all the existing features, the jQuery helper lets you do the following:
Render jQuery charts that work across PCs (including IE6/7/8), Macs, iPads, iPhones, and Android devices seamlessly
Update chart type, data, and individual cosmetic properties at run-time
Insert, prepend, and append multiple charts in an existing chart container
Customize the look and feel of all elements on the chart
Plot charts from data contained in HTML tables
Install via NPM
The easiest way to use jquery-fusioncharts
plugin is to install it from npm and include it in your build process (using Browserify , Webpack etc). Refer to the code below:
npm install jquery-fusioncharts --save
Set up the FusionCharts jQuery plugin
To set up the FusionCharts jQuery plugin, follow the steps given below:
- Include jQuery in your project:
var jQuery = require('jquery');
Import jQuery before including the FusionCharts jQuery helper the project. Note that to support IE 6/7/8, use jQuery 1.x versions.
var jQuery = require('jquery');
var FusionCharts = require('jquery-fusioncharts');
var Charts = require('fusioncharts/fusioncharts.charts');
The above steps complete the setup, and you are now ready to begin using the FusionCharts jQuery plugin.