本文介绍了NVD3堆叠条形图选项不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试使用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.

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堆叠条形图选项不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-25 21:01