0

我试图在我的 SVG 线的起点/终点有实线,但标记使用它们保持形状的值。有什么办法可以防止这种情况发生吗?

这是我当前的 SVG:

<svg xmlns="http://www.w3.org/2000/svg">
    <defs>
        <marker id="start" refX="5" refY="5" markerUnits="userSpaceOnUse" markerWidth="10" markerHeight="10" orient="auto">
            <circle cx="5" cy="5" r="5" fill="none" stroke="black" />
        </marker>
        <marker id="end" refX="10" refY="5" markerUnits="userSpaceOnUse" markerWidth="10" markerHeight="10" orient="auto">
            <path id="arrow" d="M 0 0 L 10 5 L 0 10 L 0 0" fill="none" stroke="black" />
        </marker>
    </defs>
    <g>
        <path d="M10 50 L70 50" stroke="black" fill="none" stroke-width="0.75pt" stroke-dasharray="10,4" marker-start="url(#start)" marker-end="url(#end)" />       
    </g>
</svg>

我希望圆圈和箭头是实心的。我尝试在圆圈和路径上添加 stroke-dasharray="none" ,但没有成功。

4

3 回答 3

4

嗯,这看起来像一个 webkit 错误。stroke-dasharray="none"根据规范应该是正确的属性,但stroke-dasharray="0"适用于所有浏览器,它应该达到相同的结果(根据规范)。

于 2012-11-29T18:51:03.197 回答
0

Safari 6 似乎忽略了该stroke-dasharray="0"属性。我能找到的唯一解决方法是将 stroke-dasharray 设置为大于markerWidth/的值markerHeight

于 2012-12-01T20:41:39.450 回答
-1

也不stroke-dasharray="0"适合..="none"我。
esad的回答启发了我。
但我认为更好的做法是stroke-dasharray="100%"

于 2017-03-06T06:45:44.447 回答