FusionCharts - Gallery Example - Scroll Stacked Column 2D

Created using FusionCharts Suite XT - www.fusioncharts.com

by André Albson

HTML

<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<!-- A simple Scroll Stacked Column 2D chart -->
<div id="chart-container">FusionCharts will render here</div>

JavaScript

FusionCharts.ready(function(){
    var salesChart = new FusionCharts({
        type: 'scrollstackedcolumn2d',
        dataFormat: 'json',
        renderAt: 'chart-container',
        width: '550',
        height: '350',
        dataSource: {
            "chart": {
                "caption": "Sales Comparison",
                "subCaption": "(FY 2012 to FY 2013)",
                "captionFontSize": "14",
                "subcaptionFontSize": "14",
                "subcaptionFontBold": "0",
                "xaxisname": "Month",
                "yaxisname": "Revenue",
                "showvalues": "0",
                "numberprefix": "$",
                "legendBgAlpha": "0",
                "legendBorderAlpha": "0",
                "legendShadow": "0",
                "showborder": "0",
                "bgcolor": "#ffffff",
                "showalternatehgridcolor": "0",
                "showplotborder": "0",
                "showcanvasborder": "0",
                "legendshadow": "0",
                "plotgradientcolor": "",
                "showCanvasBorder": "0",
                "showAxisLines": "0",
                "showAlternateHGridColor": "0",
                "divlineAlpha": "100",
                "divlineThickness": "1",
                "divLineIsDashed": "1",
                "divLineDashLen": "1",
                "divLineGapLen": "1",
                "lineThickness": "3",
                "flatScrollBars": "1",
                "scrollheight": "10",
                "numVisiblePlot": "12",
                "showHoverEffect":"1"
            },
            "categories": [
                {
                    "category": [
                        { "label": "Jan 2012" },
                        { "label": "Feb 2012" },
                        { "label": "Mar 2012" },
                        { "label": "Apr 2012" },
                        { "label": "May 2012" },
                        { "label": "Jun 2012" },
                        { "label": "Jul 2012" },
  ...