FusionCharts - Gallery Example - Scroll Line 2D Chart

Created using FusionCharts Suite XT - www.fusioncharts.com

HTML

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

JavaScript

FusionCharts.ready(function() {
  var salesChart = new FusionCharts({
    type: 'scrollline2d',
    dataFormat: 'json',
    renderAt: 'chart-container',
    width: '750',
    height: '250',
    dataSource: {
      "chart": {
        "labelDisplay": "wrap",
        "caption": "Transport Switch Over",
        "palettecolors": "#fe00fe,#5c005c",
        //"formatNumberScale ":"1",
        //"sformatNumberScale ":"1",
        //    "pYAxisName": "Usage Breakdown(As Area Chart)",
        "numVisiblePlot": "25",
        "labelStep": "5",
        // "sYAxisName":" Line/MaxSpeed(As Line Chart)",
        //	"sNumberSuffix": "bps",
        "showValues": "0",
        "interactivelegend": "1",
        "exportEnabled": "1",
        // "Yaxismaxvalue":"10",
        "exportFormats": "XLS=Export Chart Data",
        "exportFileName": "Transport Switch Over"
      },
      "categories": [{
        "category": [{
          "label": "Jan<br>2012<br>0:00"
        }, {
          "label": "Feb<br>2012<br>0:00"
        }, {
          "label": "Mar<br>2012<br>0:00"
        }, {
          "label": "Apr<br>2012<br>0:00"
        }, {
          "label": "May<br>2012<br>0:00"
        }, {
          "label": "Jun<br>2012<br>0:00"
        }, {
          "label": "Jul<br>2012<br>0:00"
        }, {
          "label": "Aug<br>2012<br>0:00"
        }, {
          "label": "Sep<br>2012<br>0:00"
        }, {
          "label": "Oct<br>2012<br>0:00"
        }, {
          "label": "Nov<br>2012<br>0:00"
        }, {
          "label": "Dec<br>2012<br>0:00"
        }]
      }],
      "dataset": [{
      	"seriesname":"series1",
        "data": [{
          "value": "2"
        }, {
          "value": "2"
        }, {
          "value": "0"
        }, {
          "value": "2"
        }, {
          "value": "0"
        }, {
          "value": "0"
        }, {
          "value": "2"
        }, {
          "value": "1"
        }, {
          "value": "2"
        }, {
          "value": "1"
        }, {
  ...