javascript - Topojson 动画一次飞行

Question

我尝试根据两个坐标对(作为起点和着陆点)为单次飞行制作动画。但是我遇到了错误:

Error: attribute d: Expected number, "...".

来自 d3.js。

我不认为 d3 本身有问题；它更有可能是我的实现。这是我对真正的罪魁祸首的预感:

           var routeOne = svg.append('path')
              .datum({type: "LineString", coordinates: [coordinatesSH,coordinatesTK]})
              .attr('class', 'route')
              .attr('d', path);

完整代码在我的block .

根据我的最佳检查和故障排除，一切似乎都井井有条。为了简单起见，我什至对坐标数据进行了硬编码。我不确定为什么不行。

问题是什么导致了错误，我怎样才能让飞机动画简单地从一个点到另一个点？

Answer 1

您的基准具有投影坐标。相反，它应该只包含坐标本身:

.datum({type: "LineString", coordinates: [[121.4737,31.2304],[139.7690,35.3804]]})

这里是你的代码更改:https://bl.ocks.org/GerardoFurtado/35411b29afd3b69f5310f395109b09e2/caeb523aef9dd377a9d3ba624e32b9f3d93d1ccf