FusionCharts - Gallery Example - Column2D Chart

Created using FusionCharts Suite XT - www.fusioncharts.com

by Siva Subramaniam

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 myChart = new FusionCharts({
        type: 'mscolumn3d',
        renderAt: 'chart-container',
        width: '400',
        height: '300',
        dataFormat: 'json',
        dataSource: {
            "chart": {
                "caption": "Weekly Sales Summery",
                    "subCaption": "",
                    "xAxisName": "Week",
                    "yAxisName": "Amount",
                    "numberPrefix": "$",
                    "theme": "fint"
            },

                "categories": [{
                "category": [{
                    "label": "Week 1"
                }, {
                    "label": "Week 2"
                }]
            }],
                "dataset": [{
                "data": [{
                    "value": "14400"
                }, {
                    "value": "12400"
                }]
            }]
        }
    });
    myChart.addEventListener("dataplotclick", function (e, d) {
        alert("Clicked on dataplot");
    });
    myChart.addEventListener("chartClick", function (e, d) {
        // Code here to prevent the alert box, if it is clicked on dataplot
        // Tried stopPropagation, preventDefault on dataplotclick method. Nothing works
        alert("Clicked on chart");
    });
    myChart.render();
});