我可以通过 ZingChart 中的单个渲染函数调用来渲染多个图表吗?

2024-02-01

我参观过ZingChart 的文档并了解了方法渲染多个图表 by 调用多个渲染函数像这样。

  zingchart.render({
    id:'chartDiv1',
    data:myChart1,
    height:300,
    width:500
  });
  zingchart.render({
    id:'chartDiv2',
    data:myChart2,
    height:300,
    width:500       
  });
  zingchart.render({
    id:'chartDiv3',
    data:myChart3,
    height:300,
    width:500
  });
  zingchart.render({
    id:'dashboardDiv',
    data:myDashboard,
    height:500,
    width:700
  });

但在我的代码中我想少写代码这对我来说应该更有效,因为它也由我的老板指导.

所以我的问题是我可以通过调用一个渲染函数来渲染多个图表吗? 就像是:

zingchart.render({
    id:{'chartDiv1','chartDiv2','chartDiv3','chartDiv4'},
    data:{myChart1,myChart2,myChart3,myChart4},
    height:300,
    width:500
  });

提前致谢。


完全披露,我是 ZingChart 团队的成员。

我们目前不支持上面的示例代码,但您可以通过多种方法使用 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);

如果你想保留数组内容,你也可以循环。

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);
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

我可以通过 ZingChart 中的单个渲染函数调用来渲染多个图表吗? 的相关文章

随机推荐