沿路径插值转换函数

Question

我正在努力重建一条“沿着路径的路径”＆＃39;按照以下代码进行d3可视化：http://bl.ocks.org/mbostock/1705868。

看起来很简单，我只是无法理解＆＃39; translateAlong＆＃39;中嵌套函数中的参数。每10秒调用一次的函数：

function translateAlong(path) {
  var l = path.getTotalLength();
  return function(d, i, a) {
    return function(t) {
      var p = path.getPointAtLength(t * l);
      return "translate(" + p.x + "," + p.y + ")";
    };
  };
}

在第一个嵌套的匿名函数中：

• d始终未定义
• 我等于0
• a等于＆＃39;翻译（480,200）＆＃39; （路径起点的坐标）

在第二个嵌套的匿名函数中：

• t在动画运行的10秒内逐渐从0增加到1

我的问题是 d，i和第一个匿名函数中的参数，它们如何用于获取第二个匿名函数

Answer 1

d会返回一个函数，当转换开始时，i会调用该函数，a将调用它传递d，i和a的参数tween.call(this, d, i, this.getAttribute(name))其中：

1. d3是与发生转换的元素绑定的基准。这始终是未定义的，因为没有数据绑定到该圈。
2. return function() { return function(t) { ... 是其选择中元素的索引。它始终为0，因为它是选择中唯一的元素。
3. function(t)更加神秘，因为documentation没有提到它。查看source code调用d3，因为您注意到t将传递正在调整的属性的值，在本例中为变换。

唉，因为补间中实际上没有使用这些参数，所以Bostock先生可能只是编码了它：

post.deletePost

接下来，此函数返回另一个带有签名$parent.deletePost(post._id)的函数。这是函数let endPos = startPos.translate({characterDelta: error.location.length, lineDelta: 5}); 将在转换中调用的每一步，传递参数{{1}}，表示转换中的当前步骤/时间。

Answer 2

第一个函数作为attrTween的参数返回，根据transition.attrTween documentation，它需要一个可以与d，i调用的函数， a个参数，用于获取将在t时间内传递的函数。如果不了解记录的界面，这些可能看起来像是任意或神奇的参数。