SVG 标记 : prevent inheritance its shape scale

Question

我需要 SVG 中的可扩展架构。但有些元素，如箭头，无论模式的比例如何，都应该在模式上具有相同的大小。
我正在通过 SVG transform attribute 实现模式可扩展性和箭头通过 SVG markers .
但我遇到了麻烦:当 transform=scale(s)应用于形状，那么它们的标记也是比例。

SVG 中有什么方法可以将标记应用于缩放的形状，以便标记不会根据形状的变换进行缩放？
还是我为此使用了错误的方法？

请参阅此处的示例:

<svg id="svg-root" class="drawing" width="100%" height="500" xmlns="http://www.w3.org/2000/svg">
    <defs>
        <marker id="myMarker" refX="6" refY="6" markerWidth="12" markerHeight="12" stroke-width="1" stroke="blue" orient="auto" fill="none" markerUnits="strokeWidth">
            <circle cx="6" cy="6" r="5" />
        </marker>
    </defs>
    <g transform="scale(2)">
        <line id="line1" x1="20" y1="50" x2="200" y2="50" stroke="green" stroke-width="1" marker-start="url(#myMarker)" vector-effect="non-scaling-stroke"/>
    </g>
    <g transform="scale(3)">
        <line id="line2" x1="20" y1="50" x2="200" y2="50" stroke="green" stroke-width="1" marker-start="url(#myMarker)" vector-effect="non-scaling-stroke"/>
    </g>
</svg>

两条线路 line1和 line2应该有半径=“6”的圆圈和圆圈笔划宽度=“1”。
现在半径是“12”和“18”。宽度相应地为“2”和“3”。那是不合适的。

我正在尝试申请 vector-effect="non-scaling-stroke"到形状。然后形状笔划宽度不缩放。我正在申请 markerUnits="strokeWidth"标记。
但这无济于事。

我可以想象一下，唯一的解决方法是停止使用 transform用于模式缩放。在这种情况下，将在更新模式比例后手动重新计算形状的坐标。这看起来并不好，实际上。

Answer 1

来自 here :

To avoid the automatic scaling of markers to fit the stroke width of the path using it, set the markerUnits attribute to userSpaceOnUse. That way the markers will keep their size regardless of the stroke width of the path using it.

例如:

<marker id="myMarker" markerUnits="userSpaceOnUse">
  ...
</marker>