我試圖水平翻轉下面的SVG:
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 36.1 25.8" enable-background="new 0 0 36.1 25.8" xml:space="preserve">
<g>
<line fill="none" stroke="#FFFFFF" stroke-width="3" stroke-miterlimit="10" x1="0" y1="12.9" x2="34" y2="12.9"></line>
<polyline fill="none" stroke="#FFFFFF" stroke-width="3" stroke-miterlimit="10" points="22.2,1.1 34,12.9 22.2,24.7 "></polyline>
</g>
</svg>
我已經嘗試了transform="scale(1,-1) translate(0,-100)"以及其他一些變體,它所做的只是刪除矢量。我這里還有一個密碼本:https://codepen.io/bick/pen/eYNQaqX
謝謝!
單獨在負水平方向上縮放會將該組移動到它自己的視圖框之外:transform = & quotscale(-11)& quot;
所以你需要同時把組平移回負水平方向:transform = & quotscale(-11)translate(-36.1 0)& quot;
body {
background: #000;
}
<svg viewBox="0 0 36.1 25.8">
<g transform="scale(-1 1) translate(-36.1,0)">
<line fill="none" stroke="#FFFFFF" stroke-width="3" stroke-miterlimit="10" x1="0" y1="12.9" x2="34" y2="12.9"></line>
<polyline fill="none" stroke="#FFFFFF" stroke-width="3" stroke-miterlimit="10" points="22.2,1.1 34,12.9 22.2,24.7"></polyline>
</g>
</svg>