javascript - 如何使用 highcharts 绘制堆积柱形图？

Question

[["isis",14823424,1012],["isis",7589888,1011],["isis_uv",458752,1115],["bgp",524066816,1059],["bgp_policy_reg_agent",352256,146] ,["isis",7655424,1013],["isis_policy_reg_agent",290816,314]]

Here [0] index is the x-axis  
     [1] index is the y-axix  
     [2] index is the legend value

我想绘制一个像这样的图表

JSFiddle Link

请指导我绘制它..

Answer 1

Mike Zavarello 详细描述了您的问题。

如果您无法(或不想)格式化数据，下面的函数将为您执行此操作。

chart: {
    type: 'column',
    events: {
      load: function() {
        var chart = this,
          categories = [],
          series = [];
        data.forEach(function(elem) {
          if (!categories.includes(elem[0])) {
            categories.push(elem[0])
          }
        })
        data.forEach(function(elemData) {
          series.push({
            name: elemData[2],
            data: (function() {
              var dataPoints = [];
              categories.forEach(function() {
                dataPoints.push(0)
              })
              categories.forEach(function(elemCategories, j) {
                if (elemCategories == elemData[0]) {
                  dataPoints[j] = elemData[1]
                }
              })
              return dataPoints
            })()
          })
        })
        chart.update({
          series: series,
          xAxis: {
            categories: categories
          }
        }, true, true)
      }
    }
  },

您可以在此处查看示例:https://jsfiddle.net/BlackLabel/mqotyc64/