FusionCharts - Gallery Example - Pie 2D Chart
Created using FusionCharts Suite XT - www.fusioncharts.com
HTML
<script src="https://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="https://csm.fusioncharts.com/projects/themes/hulk-light.js"></script>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<div id="chart-container">FusionCharts will render here</div>
CSS
body {
background-color: #FFFFFF;
}
JavaScript
FusionCharts.ready(function() {
var oilResChart = new FusionCharts({
type: 'column2d',
renderAt: 'chart-container',
width: '100%',
height: '400',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "Top Global Oil Reserves",
"subCaption":"[2015-16]",
"xAxisName": "MMbbl= One Million barrels",
"yAxisName": "Reserves (MMbbl)",
// extra attributes
"numberSuffix": "K",
"showValues": "0",
"paletteColors": "#81BB76",
"showHoverEffect": "1",
"use3DLighting": "0",
"showaxislines": "1",
"adjustDiv": "0",
"yAxisMaxvalue": 11
},
"data": [{
"label": "Venezuela",
"value": "1"
}, {
"label": "Saudi",
"value": "2"
}, {
"label": "Canada",
"value": "3"
}, {
"label": "Iran",
"value": "4"
}, {
"label": "Russia",
"value": "5"
}, {
"label": "UAE",
"value": "6"
}, {
"label": "US",
"value": "6"
}, {
"label": "China",
"value": "7"
}]
}
}).render();
});