我正在嘗試使用矩陣中的 scale() 方法縮放 SVG 元素，但忽略了 scaleY 引數。
我希望元素在 Y 軸上縮放 4 倍，但忽略第二個縮放引數。難道我做錯了什么？
var elem = document.querySelector('#test');
var transformList = elem.transform.baseVal,
transform = transformList.getItem(0),
matrix = transform.matrix;
transform.setMatrix(matrix.scale(1.1, 4));
transformList.replaceItem(transform, 0);<svg>
<rect width="100" height="100" id="test" transform="matrix(1, 0, 0, 1, 0, 0)"></rect>
</svg>uj5u.com熱心網友回復：
根據 SVG 規范 scale 需要一個引數。你需要scaleNonUniform ...
var elem = document.querySelector('#test');
var transformList = elem.transform.baseVal,
transform = transformList.getItem(0),
matrix = transform.matrix;
transform.setMatrix(matrix.scaleNonUniform(1.1, 4));
transformList.replaceItem(transform, 0);html, body {
width: 100%;
height: 100%;
}<svg width="100%" height="100%">
<rect width="100" height="100" id="test" transform="matrix(1, 0, 0, 1, 0, 0)"></rect>
</svg>轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/434745.html
下一篇：如何使文本沿svg曲線居中