Next
Prev

A slide chart can be used for the purpose of presentation. Create the charts you want to present, then combine them as a single chart.

function chartReadyHandler(id) {
  var layout1 = getCartesianLayout("Column2D" , "Column 2D Chart" ,["Profit"]);
  var layout2 = getCartesianLayout("Line2D" , "Line Chart" , ["Profit"]);
  var layout3 = getCartesianLayout("Column3D" , "Column 3D Chart - MultiSeries" , ["Profit" , "Cost"]);

  layoutSet = [layout1, layout2, layout3, radarLayout];
  dataSet = [chartData, chartData2, chartData3, chartData3];

  document.getElementById(id).setSlideLayoutSet(layoutSet);

  document.getElementById(id).setSlideDataSet(dataSet);
}

function getCartesianLayout(type, title, dataField) {
  var layout="<KoolChart borderStyle='none'>"
    +"<Options><Caption text='" + title + "' /></Options>"
    +"<NumberFormatter id='numfmt' useThousandsSeparator='true'/>"
    +"<" + type + "Chart showDataTips='true'>"
    +"<series>";

  var interval = type == "Column3D" ? 1000 : 3000;

  for(var i=0; i<dataField.length; ++i) {
    layout += "<" + type + "Series yField='" + dataField[i] + "' displayName='" + dataField[i] + "'/>"
  }

  layout += "</series>"
    +"<horizontalAxis>"
    +  "<CategoryAxis categoryField='Month'/>"
    +"</horizontalAxis>"
    +"<verticalAxis>"
    +  "<LinearAxis interval='" + interval + "' formatter='{numfmt}' />"
    +"</verticalAxis>"
    +"</" + type + "Chart>"
    +"</KoolChart>";
    
  return layout;
}

© 2017 KoolChart. All rights reserved.