Skip to content
Official JSCharting Samples for Vue.js
JavaScript HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src
.gitignore
README.md
gruntfile.js
package-lock.json
package.json
serve.json

README.md

JSCharting: Any Chart. Anywhere.

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.

Official JSCharting examples for vuejs

This pack of examples demonstrate how to use JSCharting with vuejs framework.

How to use

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

How it works

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>'
});
You can’t perform that action at this time.