Question

我已经通过以下代码完成了“指向路径” d3的可视化：https://bl.ocks.org/mbostock/1705868。我了解代码。

并在我的代码中使用了它，并成功地使圆沿地图上两个位置之间的路径移动。问题是将路径平移到新位置并对其进行缩放。那里的圆圈仍在其旧路径中移动，而不是在经过转换的路径中。

原始路径在控制台中显示为：

<path fill="#f4ab03" d="M938.9205757035511,198.71688021141057A210.4627512788538,210.4627512788538 0 0,1 1071.4577386252327,362.2053205383533"></path>

转换后的路径显示为：

<path fill="#f4ab03" d="M938.9205757035511,198.71688021141057A210.4627512788538,210.4627512788538 0 0,1 1071.4577386252327,362.2053205383533" transform="translate(-128.89999389648438,-54.400001525878906)scale(1.2000000476837158,1.2000000476837158)"></path>

在转换后的路径中，只有转换和缩放是多余的。我对此进行了搜索和尝试，但无法解决该问题。我尝试过：

function translateAlong(path, translateMap, scaleMap) {
                var l = path.getTotalLength();
                    return function(d, i, a) {
                        return function(t) {
                            if (translateMap) {
                                // here still taken as old path values, not wanted
                                return "translate(" + (p.x + translateMap[0]) + "," + ( p.y + translateMap[1]) + ") scale(" + scaleMap + "," + scaleMap + ")";
                            } else {
                                return "translate(" + p.x + "," + p.y + ")";
                            }
                            //return "translate(" + p.x + "," + p.y + ")";
                    };
                };
            }

希望我已经清楚地表达了我的问题。

谢谢

沿已平移和缩放的路径平移点

0 个答案: