Javascript NVD3 arcTween func引发未定义错误

我正在使用NVD31.8.1和D33.5.6

我有一个奇怪的问题，由于某种原因（大约5-10%的时间）我的图表无法加载

错误是nv.d3.js中的arcTween函数（对于piechart）抛出的“UncaughtTypeError:object不是函数”：

function arcTween(a, idx) {
            a.endAngle = isNaN(a.endAngle) ? 0 : a.endAngle;
            a.startAngle = isNaN(a.startAngle) ? 0 : a.startAngle;
            if (!donut) a.innerRadius = 0;
            var i = d3.interpolate(this._current, a);
            this._current = i(0);
            return function (t) {
                return arcs[idx](i(t));
            };
        }

调试时，我可以看到值到处都是，即idx似乎是对整个nvd3库的引用，而不是一个整数i'是一个数字而不是一个函数，这个。\ u当前未定义等

如果我刷新页面，平均可能有5-10%的时间会断页。除此之外，一切正常，正如预期的那样

我创建了一个代码笔，但不幸的是无法复制该问题。。。我可能应该提到，这些都包含在angular指令中，并在创建指令时由angular传入的“元素”生成

考虑到我只能在代码中断断续续地重新创建它，我知道这一定是我的代码出了问题，但我无法找出它，所以作为最后的手段，我想在这里发布这个问题

以前有人见过这个问题吗？有没有解决这个问题的建议？我在想一些事情，比如检查图形是否正确生成，否则尝试再次渲染，但找不到根本原因很烦人

如果有任何建议，我将不胜感激

萨姆

编辑：

此外，图表部分生成，只是每个“切片”缺少“路径”：

<svg class="_pie1 nvd3-svg"><g class="nvd3 nv-wrap nv-pieChart" transform="translate(20,30)"><g><g class="nv-pieWrap nvd3-svg"><g class="nvd3 nv-wrap nv-pie nv-chart-2110" transform="translate(0,0)"><g><g class="nv-pie" transform="translate(177.5,172.5)"><g class="nv-slice" fill="#00385D" stroke="#00385D"><path></path></g><g class="nv-slice" fill="transparent" stroke="transparent"><path></path></g></g><g class="nv-pieLabels" transform="translate(177.5,172.5)"></g></g></g></g><g class="nv-legendWrap"></g></g></g><text x="195" y="180" dy="-.7em" class="nv-title" style="text-anchor: middle;">Total income*</text><text x="195" y="210" dy="-.7em" class="nv-titleValue" style="text-anchor: middle;">£4,543</text><line x1="130" y1="205" x2="265" y2="205" stroke-width="0.1" stroke="#333333"></line><text x="195" y="245" dy="-.7em" class="nv-title" style="text-anchor: middle;">Total outgoings</text><text x="195" y="275" dy="-.7em" class="nv-titleValue" style="text-anchor: middle;">£46,574</text></svg>

总收入*4543英镑总支出46574英镑

再次编辑：如果我删除50ms超时（请参阅codepen），我每次都会收到错误，因此这里有一些计时问题

return arcs[idx](i(t));

这看起来像是一个意外的函数调用，可能会导致您的错误

如果您希望在那里进行乘法运算，那么我建议显式使用星号（*）

e、 g

这看起来像是一个意外的函数调用，可能会导致您的错误

如果您希望在那里进行乘法运算，那么我建议显式使用星号（*）

e、 g

---

好吧，我知道了。基本上，我们创建了值为1的piecharts，然后将其更改为实际值，这样我们就可以得到一个很好的nvd3转换（因为如果图形加载了实际值，nvd3不会动画，只有在更改它们时才会动画）

---

我们有一个50毫秒的超时，目的是等待页面可见加载（我们有一个淡入动画），因此用户在页面加载时可以看到piechart动画，但这实际上掩盖了快速连续两次设置图表值（设置为1，然后设置为实际值）的问题，这是导致问题的原因。很明显，偶尔渲染图形需要超过50毫秒，因此我们得到了间歇性错误

好吧，我想出来了。基本上，我们创建了值为1的piecharts，然后将其更改为实际值，这样我们就可以得到一个很好的nvd3转换（因为如果图形加载了实际值，nvd3不会动画，只有在更改它们时才会动画）

---

我们有一个50毫秒的超时，目的是等待页面可见加载（我们有一个淡入动画），因此用户在页面加载时可以看到piechart动画，但这实际上掩盖了快速连续两次设置图表值（设置为1，然后设置为实际值）的问题，这是导致问题的原因。很明显，偶尔渲染图形需要超过50毫秒，因此我们得到了间歇性错误

您好@DubstepCat，这是正确的，该行抛出了错误。这是一个来自nvd3库的函数。我按照您的建议对其进行了更改，但这导致图形从未生成并每次抛出错误（错误：属性d=“NaN”的值无效）。感谢您的提示helpHi@DubstepCat，该行抛出错误是正确的。这是一个来自nvd3库的函数。我按照您的建议对其进行了更改，但这导致图形从未生成并每次抛出错误（错误：属性d=“NaN”的值无效）。感谢您的及时帮助很高兴您已排序：）很高兴您已排序：）

return arcs[idx] * (i(t));