NVD3堆叠条形图选项不起作用 [英] NVD3 stacked bar chart option not working

问题描述

我正在尝试使用nvd3数据创建条形图.分组选项工作正常，但是当我选择堆叠时，会出现以下错误.

I am trying to create bar chart using nvd3 data. Grouped option is working fine but when I select Stacked it gives following error.

未捕获的TypeError:无法读取未定义(...)的属性'1'

Uncaught TypeError: Cannot read property '1' of undefined(…)

JSON格式如下.

var test =  [

     {
         "key":"A",
         "values":
             [
                {"x":"2016-11-24","y":34},
                {"x":"2016-11-25","y":10}
              ]
     },
     {
         "key":"B",
         "values":
             [
              {"x":"2016-11-25","y":15}
             ]
     },
     {
         "key":"C",
         "values":
             [
              {"x":"2016-11-28","y":11}
              ]
     },
]

javascript代码:

javascript code:

var chart;
nv.addGraph(function() {
    chart = nv.models.multiBarChart()
    .color(d3.scale.category10().range())
      .rotateLabels(0)      //Angle to rotate x-axis labels.
      .transitionDuration(300)
       .showControls(true)   //Allow user to switch between 'Grouped' and 'Stacked' mode.
      .groupSpacing(0.24)    //Distance between each group of bars.

      ;

chart.reduceXTicks(false).staggerLabels(true).groupSpacing(0.3);

chart.x(function(d) { return d.x; });
chart.y(function(d) { return d.y; });

    d3.select('#chart1 svg')
        .datum(test)
       .call(chart);

    nv.utils.windowResize(chart.update);



    return chart;
});

我已经尝试过，但是找不到答案.有帮助吗?

I have tried it but can't find answer. Any help ?

推荐答案

答案在JSON数据中.基本上，values数组在所有数据系列中的长度都应相同.在您的示例中，当nvd3将数据转换为堆叠视图时，它期望具有values数组的第二个元素.

Answer is in the JSON data. Basically the values array should have the same length across all data series. In your example when nvd3 transforms data into stacked view it expects to have a 2nd element of the values array.

{
 "key":"B",
 "values":
  [
      {"x":"2016-11-25","y":15}
  ]
}

这篇关于NVD3堆叠条形图选项不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！