使用组BBOX查找SVG元素的新坐标

如何获取图像元素的新大小和坐标属性，以便父组容器BBOX应该更改为新的目标值

以下是我的SVG：

<svg width="500"height ="500" xmlns="http://www.w3.org/2000/svg">
  <g id="my_grp">
    <image width="350" height="150" transform="translate(100 100) rotate(35 175 75)" href="https://via.placeholder.com/350x150"></image>
  </g>
</svg>

我想将我的_grp框的大小调整30%，并将其移动到（30，40）坐标。如何更改图像属性以实现它

你可以查一下

---

谢谢

您可以借助接口来计算必要的转换。从标识矩阵开始，然后移动坐标系，将组内容绘制到：

const group=document.querySelector（'my#u grp'）；
const bbox=group.getBBox（）；
//初始化一个单位矩阵
const matrix=document.querySelector（'svg'）.createSVGMatrix（）；
常数{a，b，c，d，e，f}=矩阵
.翻译（30,40）
.比例（0.7）
.translate（-bbox.x，-bbox.y）；
常量转换='矩阵'+[a，b，c，d，e，f].连接（'，'）+'）'；
setAttribute（'transform'，transform）


[object SVGRect] {
  height: 323.62457275390625,
  width: 372.73968505859375,
  x: 88.63015747070312,
  y: 13.18772029876709
}