svg - 如何在SVG中绘制不是三角形的标记？

Question

例如，像这个矩形标记

Answer 1

使用 a 中的<marker>元素<def>。marker-start="url(#id)"然后，您可以通过使用（或使用 marker-mid 或 marker-end）引用其 id 在开头和结尾添加标记。您可以在标记标签中定义您喜欢的任何形状。下面的示例只是您的示例中的一条垂直线。

<defs>
    <marker id="marker-bar"
            refX="0" refY="5"
            markerHeight="20"
            markerWidth="20"
            viewBox="0 0 10 10"
            orient="auto"
            markerUnits="strokeWidth">
        <path stroke="#111" d="M0 0 v10"/>
    </marker>
</defs>

<path stroke="#111" fill="none"
      d="M152,172 C62,174 190,28 192,122"
      marker-end="url(#marker-bar)"/>