FusionCharts - Gallery Example - Multi-series Area 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://static.fusioncharts.com/code/latest/fusioncharts.charts.js"></script>
<div id="chart-container">
  FusionCharts will render here</div>

JavaScript

FusionCharts.ready(function() {
  var salesChart = new FusionCharts({
      type: 'mscolumn3dlinedy',
      renderAt: 'chart-container',
      width: '100%',
      height: '350',
      dataFormat: 'json',
      dataSource: {
        "chart": {
          "caption": "Product-wise Quarterly Revenue vs. Profit %",
          "subCaption": "Harry's SuperMart - Last Year",
          "xAxisname": "Quarter",
          "pYAxisName": "Sales",
          "sYAxisName": "Profit %",
          "numberPrefix": "$",
          "sNumberSuffix": "%",
          "sYAxisMaxValue": "25",
          "paletteColors": "#0075c2,#1aaf5d,#f2c500",
          "bgColor": "#ffffff",
          "showBorder": "0",
          "showCanvasBorder": "0",
          "usePlotGradientColor": "0",
          "plotBorderAlpha": "10",
          "legendBorderAlpha": "0",
          "legendBgAlpha": "0",
          "legendShadow": "0",
          "showHoverEffect": "1",
          "valueFontColor": "#ffffff",
          "rotateValues": "0",
          "placeValuesInside": "1",
          "divlineColor": "#999999",
          "divLineDashed": "1",
          "divLineDashLen": "1",
          "canvasBgColor": "#ffffff",
          "captionFontSize": "14",
          "subcaptionFontSize": "14",
          "subcaptionFontBold": "0"
        },
        "categories": [{
          "category": [{
            "label": "Q1"
          }, {
            "label": "Q2"
          }, {
            "label": "Q3"
          }, {
            "label": "Q4"
          }]
        }],
        "dataset": [{
          "seriesname": "Food Products",
          "showValues": "1",
          "data": [{
            "value": "11000"
          }, {
            "value": "14000"
          }, {
            "value": "10500"
          }, {
            "value": "15000"
          }]
        }, {
          "seriesname": "Non-Food Products",
          "showValues": "1",
          "data": [{
            "value": "14400"
          }, {
            "value": "14800"
          },...