【问题标题】:Add dynamic series添加动态系列
【发布时间】:2017-09-19 17:15:48
【问题描述】:

我正在使用 Highcharts 插件,我有两个数组,这是我的数组的一个示例:

array1:Serie1、Serie2、Serie3
数组2:20、30、40

我想要做的是在系列选项中使用这个数组,数组 1 作为系列名称,数组 2 作为系列值,我可以手动执行此操作,但将来数组 1 可能会有更多值,还有数组 2。

$('#Chart').highcharts({
     title: {
        text: 'Example'
     },
     xAxis: {
        labels:
        {
          enabled: false
        }
     },
     yAxis: {
         allowDecimals: true,
         min: 0,
         title: {
              text: 'Results'
         }
      },
      credits: {
         enabled: false
      },
      legend: {
         reversed: true
      },
      series: [{
          name: array1[x],
          data: array2[x].map(function (value) {
             return Number(value);
          })
      }]
});

我尝试使用 for 循环,但我认为不可能使用此内部系列选项。此外,我正在尝试在 highcharts 代码之外使用 for 循环并使用字符串 var 连接上述代码,但我对此不太确定,这是我的代码:

var constructor = "";
for (var i = 0; i < array1.length; i++) {
      constructor += "name: '"+ array1[i] + "',";
      constructor += "data: " + array2[i] + ".map(function (value) {"
      constructor += "return Number(value);";
})

【问题讨论】:

  • 当array1和array2被修改时,刷新图表,应该会反映出来。
  • 在创建图表之前创建系列。示例:jsfiddle.net/job9dq7j.

标签: javascript jquery arrays highcharts


【解决方案1】:

您可以创建不带系列的图表,然后在单独的函数中对数组进行迭代以正确获取数据并以这种方式动态添加系列:

for (var i = 0; i < array1.length; i++) {
    chart.addSeries({
        name: array1[i],
        data: [array2[i]]
    }, false);
}
chart.redraw();

未经测试,但想法是这样的

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-03-11
    • 2021-02-12
    • 2021-06-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多