Question

我正在使用angular nvd3创建multibarchart。它以分组格式正确显示数据，但单击堆叠时仅显示单色。我为它创造了一个掠夺者。任何想法我做错了什么？

  $scope.options = {
        chart: {
            type: 'multiBarChart',
            height: 450,
            margin : {
                top: 20,
                right: 20,
                bottom: 45,
                left: 45
            },
            clipEdge: true,
            duration:500,
            xAxis: {
                axisLabel: 'Date/Hour',
                showMaxMin: false,
                tickFormat: function(d){
                    if($scope.hourly === 'Y')
                        return d3.format(',f')(d);
                    else {
                        var dt = new Date(d);
                        dt.setTime(dt.getTime() + dt.getTimezoneOffset() * 60 * 1000);
                        return d3.time.format('%Y-%m-%d')(dt);
                    }
                }
            },
            yAxis: {
                axisLabel: 'Count',
                axisLabelDistance: -20,
                tickFormat: function(d){
                    return d3.format(',f')(d);
                }
            }
        }
    };

    $scope.data = [   {
  "key":"5-ISSUED",
  "values":[
     {
        "x":"2016-05-12",
        "y":"736"
     },
     {
        "x":"2016-05-11",
        "y":"1051"
     },
     {
        "x":"2016-05-10",
        "y":"1369"
     },
     {
        "x":"2016-05-09",
        "y":"937"
     },
     {
        "x":"2016-05-08",
        "y":"118"
     },
     {
        "x":"2016-05-07",
        "y":"59"
     },
     {
        "x":"2016-05-06",
        "y":"430"
     }
  ]
},
{
  "key":"4-PAID",
  "values":[{
        "x":"2016-05-12",
        "y":"628"
     },
     {
        "x":"2016-05-11",
        "y":"1052"
     },
     {
        "x":"2016-05-10",
        "y":"1624"
     },
     {
        "x":"2016-05-09",
        "y":"1256"
     },
     {
        "x":"2016-05-08",
        "y":"116"
     },
     {
        "x":"2016-05-07",
        "y":"59"
     },
     {
        "x":"2016-05-06",
        "y":"395"
     }
  ]
},
{
  "key":"0-ABANDONDED",
  "values":[
     {
        "x":"2016-05-12",
        "y":"89"
     },
     {
        "x":"2016-05-11",
        "y":"102"
     },
     {
        "x":"2016-05-10",
        "y":"77"
     },
     {
        "x":"2016-05-09",
        "y":"59"
     },
     {
        "x":"2016-05-08",
        "y":"2"
     },
     {
        "x":"2016-05-07",
        "y":"4"
     },
     {
        "x":"2016-05-06",
        "y":"49"
     }
   ]
 }
]

Link to Plunker

Answer 1

您在y

中传递字符串值

 "x":"2016-05-09",
 "y":"59" //this is wrong should be a number not a string

它应该是如下的数字：

 "x":"2016-05-09",
 "y":59 //this is the right way to give number

更正后的代码here

Angular nvd3 multibarchart堆叠不正确显示

1 个答案: