使用d3.js绘制带箭头的线条时遇到问题。我确实看到了一些教程并编写了这段代码,但我只看到没有箭头标记的行。有人可以看看它,并告诉我我在哪里失踪。提前谢谢。
class Fila
答案 0 :(得分:6)
将您的标记创建更改为以下内容:
svg.append("svg:defs").append("svg:marker")
.attr("id", "triangle")
.attr("refX", 15)
.attr("refY", -1.5)
.attr("markerWidth", 6)
.attr("markerHeight", 6)
.attr("orient", "auto")
.append("path")
.attr("d", "M 0 -5 10 10")
.style("stroke", "black");
执行此操作后,您将看到正在绘制的线条。如果您需要填写箭头,可以使用fill
而不是stroke
,可以使用以下代码获取:
svg.append("svg:defs").append("svg:marker")
.attr("id", "triangle")
.attr("refX", 6)
.attr("refY", 6)
.attr("markerWidth", 30)
.attr("markerHeight", 30)
.attr("orient", "auto")
.append("path")
.attr("d", "M 0 0 12 6 0 12 3 6")
.style("fill", "black");