未捕获的类型错误：无法读取 NV D3 StackedLine 中未定义的属性“y”答案

【问题标题】：Uncaught TypeError: Cannot read property 'y' of undefined in NV D3 StackedLine未捕获的类型错误：无法读取 NV D3 StackedLine 中未定义的属性“y”
【发布时间】：2015-11-11 14:57:03
【问题描述】：

我使用 nvd3 的有用的预打包图表制作了一个堆叠折线图。

我得到图表的大部分功能都很好，但是每当我单击特定系列时，都会出现错误“未捕获的类型错误：无法读取未定义的属性 'y'”，并且图表不会调整大小以仅显示系列.

有关正确功能的示例：http://nvd3.org/examples/stackedArea.html

我检查了最常见的错误，包括不同大小的系列，但都不是。

我用来生成图表的代码是：

function stackedChart(data) {
    nv.addGraph(function() {
        var chart = nv.models.stackedAreaChart()
                      .margin({right: 100})
                      .x(function(d) { return d[0] })   
                      .y(function(d) { return d[1] })  
                      .useInteractiveGuideline(true)
                      .duration(500)    
                      .showControls(true)      
                      .clipEdge(true);


        chart.xAxis
            .tickFormat(d3.format(',.0f'));

        chart.yAxis
            .tickFormat(d3.format(',.2f'));

        d3.select('#stackedChart svg')
          .datum(data)
          .transition().duration(500).call(chart);

        nv.utils.windowResize(chart.update);

        return chart;
    });

}

stackedChart(a);

使用在 jsfiddle 中找到的数据以及错误的实时示例：https://jsfiddle.net/0yxr15ut/5/

【问题讨论】：

如果您使用面积图同时使用两个不同的图表，请确保您的 Y 轴的值存在于两个图表的数据集中。
我也看到了同样的情况，我运行检查以查看数据集中每个值的匹配标签。
@JosueIbarra：你能详细说明一下吗？
发生的事情是我有一个使用库 angularjs-nvd3-directives 的 angularjs 应用程序，我在没有调用 $scope.$apply() 的情况下更新了模型，它弄乱了图表。在 $apply() 中包含模型更新对我有用。与此无关，我在库中遇到了另一个问题，并重写了所有内容以使用 Angular-nvD3，因为它具有更好的支持和功能。

标签： javascript d3.js charts nvd3.js

【解决方案1】：

此问题已在此处得到解决： https://github.com/novus/nvd3/issues/1093 尽管不确定副作用，但有解决此问题的方法。在 nv.d3.js 中的 scatter y 函数中添加以下检查

.y(function(d) {
              if (d.display !== undefined) { return d.display.y + d.display.y0; }
              else return 0
            })

我制作了一个 for 存储库，其中包含您可以使用的更改。 https://github.com/nishantk92/nvd3.git

【讨论】：