FusionCharts Suite XT comes with an extensive range of charts, gauges, and maps that can be used to plot static and real-time data.
Some of the basic features of VueJS component are:
Enables interactivity between more than one chart.
Auto-updates the chart object when the data source is modified.
Can render charts using a JSON/XML URL or Props array binding.
In this article, we will talk about how you can download and install the Vue-FusionCharts component on your system.
Downloading the component
You can download the Vue-FusionCharts component from here.
Installing the Vue-FusionCharts component
To install the Vue-FusionCharts component for your applications, follow the steps given below:
Step 1: Include
In your HTML code, include the
It is mandatory to add the vue-fusioncharts.js file after all the other script files.
Step 2: Define the chart configuration
Step 3: Render the Chart
To pass the chart configuration, we have added the code from step 2 to
Vue.use(VueFusionCharts). The combined code is shown below:
The HTML template to render the chart is:
Once the installation is complete, you will be ready to start creating and customizing your charts using the vue-fusioncharts component. The subsequent articles in this section will tell you how.
Vue-FusionCharts is an open-source resource and distributed under the terms of the MIT/X11 License. You will still need to include FusionCharts in your page. This project provides no direct functionality. You can download a free evaluation version here. You will still need to purchase a FusionCharts license to use in a commercial environment (FusionCharts is free for noncommercial and personal use).