Responsive jQuery Charts & Graphs

Download jQuery Chart Samples

Responsive jQuery Charts that run across devices & screen sizes including Tablets, Desktop & Phones. All Graphs are Cross-Browser compatible and have 10X better performance. The given example contains HTML / jQuery source code that you can edit in-browser or save to run locally.

Try Editing The Code

Download Copy JSFiddle 
window.onload = function () {

var options = {
	animationEnabled: true,
	title: {
		text: "GDP Growth Rate - 2016"
	},
	axisY: {
		title: "Growth Rate (in %)",
		suffix: "%"
	},
	axisX: {
		title: "Countries"
	},
	data: [{
		type: "column",
		yValueFormatString: "#,##0.0#"%"",
		dataPoints: [
			{ label: "Iraq", y: 10.09 },	
			{ label: "Turks & Caicos Islands", y: 9.40 },	
			{ label: "Nauru", y: 8.50 },
			{ label: "Ethiopia", y: 7.96 },	
			{ label: "Uzbekistan", y: 7.80 },
			{ label: "Nepal", y: 7.56 },
			{ label: "Iceland", y: 7.20 },
			{ label: "India", y: 7.1 }
			
		]
	}]
};
$("#chartContainer").CanvasJSChart(options);

}

Related Customization

The theme of the chart can be changed using theme property. Some other commonly used customizations include animationEnabled, color, fillOpacity, type, etc.