Can I Render Multiple Charts By Single Renderfunction Call In ZingChart?

I visited ZingChart's documentation and came to know the methods of rendering multiple charts by calling multiple render functions like this. zingchart.render({ id:'chartDiv1

Solution 1:

Full disclosure, I'm a member of the ZingChart team.

We currently do not support the example code above but there are a couple ways you could do this with javascript.

function renderZingCharts(_id,_data) {
  zingchart.render({
    id: _id,
    data: _data,
    height:300,
    width:500
  });
}

renderZingCharts('chartDiv1', myChart1);
renderZingCharts('chartDiv2', myChart2);
renderZingCharts('chartDiv3', myChart3);
renderZingCharts('chartDiv4', myChart4);

You Could also loop through if you want to keep the array content.

function renderZingCharts(aIds, aData) {

  // do some sanity checks for length of two arrays here ???

  for (var i=0; i < aIds.length; i++) {
    zingchart.render({
      id: aIds[i],
      data: aData[i],
      height:300,
      width:500
    });
  }
}
var ids = ['chartDiv1', 'chartDiv2', 'chartDiv3', 'chartDiv4'];
var configs = [myChart1, myChart2, myChart3, myChart4];
renderZingCharts(ids,configs);