我尝试在D3中制作一个可重用的图表。图中使用.curve(d3.curveStepAfter)绘制了一条线，我尝试使用stroke-dasharray属性和一个补间函数来动画化这些线。下面的代码是我如何初始化可视化的：第一个svg中的线条绘制正确，但过渡不起作用。当我查看控制台时，我看到错误this.getTotalLength不是函数。这是因为传递了enter对象。我需要能够传递lineTween函数的路径，但我很困惑。
.curve(d3.curveStepAfter)
k3bvogb11#
在箭头函数的上下文中，this就是window。因此，要么使用常规函数，要么组合使用第三个和第二个参数来获取所需的元素：
this
window
const lineTween = (_, j, n) => { let l = n[j].getTotalLength(), i = d3.interpolateString('0,' + l, l + ',' + l); return function(t) { return i(t) }; }
1条答案
按热度按时间k3bvogb11#
在箭头函数的上下文中，
this就是window。因此，要么使用常规函数，要么组合使用第三个和第二个参数来获取所需的元素：