You can visit the new home of the JSCharting Vue.js plugin page. There you will find an npm package for the JSCharting plugin, detailed documentation, and an example project with several chart examples.
JSCharting is a JavaScript chart library for visualizing your data, providing resolution independent results across all devices and platorms. Every JSCharting license includes the full suite of 150+ advanced chart types, interactive stock charts and JSMapping at no additional charge.
This pack of examples demonstrate how to use JSCharting with vuejs framework.
Install the necessary packages including JSCharting.
npm install
Now you can build an application.
npm run build
Also you can run dev server http://localhost:5000/
npm run start
After run build script /dist folder will be created which contains application files.
Index.html includes main (main.js) bundle file.
<div id="app"></div>
<script src="scripts/main.js"></script>
Main.js contains the chart initialization code.
var app = new Vue({
el: '#app',
data: {
containerClass: {
'chart-container': true
},
styles: [{
height: '500px'
}],
chartConfig: {
...
}
},
template: '<div><JSCharting v-bind:containerClass="containerClass" v-bind:config="chartConfig" v-bind:styles="styles"></JSCharting></div>'
});