FusionCharts - Gallery Example - Stacked Column 2D
Created using FusionCharts Suite XT - www.fusioncharts.com
by AnthraxisBR
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">Gráfico</div>
CSS
body {
background-color: #FFFFFF;
}
JavaScript
FusionCharts.ready(function() {
var revenueChart = new FusionCharts({
type: 'stackedcolumn2d',
renderAt: 'chart-container',
width: '100%',
height: '350',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "Gráfico em stack de barra com valores exibidos",
"subCaption": "2017",
"theme": "hulk-light",
"showValues": "1",
},
"categories": [{
"category": [{
"label": "Q1"
}, {
"label": "Q2",
}, {
"label": "Q3"
}, {
"label": "Q4"
}]
}],
"dataset": [{
"seriesname": "Objeto",
"showvalues":1,
"data": [{
"value": "42000"
}, {
"value": "53000"
}, {
"value": "47000"
}, {
"value": "60000"
}]
}, {
"seriesname": "Outro Objeto",
"showvalues":1,
"data": [{
"value": "48000"
}, {
"value": "62000"
}, {
"value": "55000"
}, {
"value": "74000"
}]
}, {
"seriesname": "Mais um outro objeto",
"showvalues":1,
"data": [{
"value": "46000"
}, {
"value": "60000"
}, {
"value": "58000"
}, {
"value": "70000"
}]
}]
}
}).render();
});