问题描述
我在开发一个svg的编辑器网页版,目前在做缩放的内容是,发现JS操作svg的时候 缩放会有误差
原理是 每个图形有个外框 我拉伸外框 然后用拉伸后的外框宽或者高去除以拉伸前的宽或者高,得到拉伸了多少这个倍率,然后将倍率赋值给svg的scale(x,y)属性
问题出现的环境背景及自己尝试过哪些方法
用的是谷歌浏览器,目前不考虑其他浏览器的兼容,试过调整过缩放比例 还是没用
相关代码
// 请把代码文本粘贴到下方(请勿用图片代替代码)
zx = sr.getBBox().width/d.width, zy = sr.getBBox().height/d.height;//缩放比例
//d就是拉伸前的外框
stD1.setAttribute('transform','translate('+(stD1.getBBox().x+stD1.getBBox().width)
+','+(stD1.getBBox().y+stD1.getBBox().height)+')'
+' scale('+zsx+','+zsy+') '
+'translate('+-1*(stD1.getBBox().x+stD1.getBBox().width)+','
+-1*(stD1.getBBox().y+stD1.getBBox().height)+')');
//给指定SVG图形设置scale值
你期待的结果是什么?实际看到的错误信息又是什么?
本以为我拉伸了多少 就会缩放多少,看起来里面的图形和我的外框的距离是恒等的,但是目前,我对外框进行拉伸后,里面的图形的宽高虽然也按比例缩放了,但是会越来越小,导致图形不在外框的相对位置