FusionCharts - Gallery Example - Column2D Chart
Created using FusionCharts Suite XT - www.fusioncharts.com
HTML
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.charts.js"></script>
<!-- Column 2D chart showing Monthly revenues for last year -->
<div id="chart-container">FusionCharts will render here</div>
JavaScript
FusionCharts.ready(function () {
var revenueChart = new FusionCharts({
type: 'column2d',
renderAt: 'chart-container',
width: '550',
height: '350',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "Monthly revenue for last year",
"subCaption": "Harry's SuperMart",
"xAxisName": "Month",
"yAxisName": "Revenues (In USD)",
"numberPrefix": "$",
"divlineColor": "#999999",
"divLineIsDashed": "1",
"yaxisminvalue":"-30"
},
"data": [
{
"label": "Jan",
"value": "0"
},
{
"label": "Feb",
"value": "81"
},
{
"label": "Mar",
"value": "72"
},
{
"label": "Apr",
"value": "55"
},
{
"label": "May",
"value": "91"
},
{
"label": "Jun",
"value": "51"
},
{
"label": "Jul",
"value": "68"
},
{
"label": "Aug",
"value": "62"
},
{
"label": "Sep",
"value": "61"
},
{
"label": "Oct",
"value": "49"
},
{
"label": "Nov",
"value": "90"
},
{
"label": "Dec",
"value": "73"
}
]
}
...