我使用d3.svg.symbol().type("triangle-up")
作为显示路径预期方向的方法。 查看图片我的意思
我需要三角形的方向面向路径的终点。
我可以将三角形定位在路径的中间点并手动旋转它,但是,我不知道箭头需要面向哪个方向,因为路径并不总是相同。
以下是我目前所拥有的图片:
这是我想要实现的目标的图像:
这是我现在使用的代码:
请不要将代码的翻译部分中的值作为曲线的中间点:
radiusSensorsG.append("path")
.attr("class", "curved-triangles")
.attr("d", d3.svg.symbol().type("triangle-up").size(10)))
.attr("transform", function () {
if(index % 2 == 0) {
return "translate(" +
map.latLngToLayerPoint(curvedCoords[index][1].curveLatLng).x + "," +
map.latLngToLayerPoint(curvedCoords[index][1].curveLatLng).y + ")";
}
else {
return "translate(" +
map.latLngToLayerPoint(curvedCoords[index][1].curveLatLng).x + "," +
map.latLngToLayerPoint(curvedCoords[index][1].curveLatLng).y + ")";
}
})
如果它以任何方式帮助回答,我有粉红色标记的lat / lng位置。这些粉红色标记是我需要的绿色箭头朝向,粉红色的箭头朝向大绿色圆圈。
如果有任何我未提供的信息,请告诉我。
由于