我正在使用 svg.js 和 svg.import.js 来绘制 svg 图像。我尝试使用动画功能为一些元素设置动画。我不知道如何在现有转换上附加转换。这是我在 SVG 文件中的元素:
<g id="g5600" style="display:inline;" transform="matrix(0.64633527,-0.76305355,0.76305355,0.64633527,-257.64528,53.75293)">...</g>
例如,当我尝试时:
store.g5600.animate(2000).rotate(45);
结果是:
<g id="g5600" style="display:inline;" transform="rotate(45,155.6640625,382.421875)">...</g>
我希望结果在哪里(现有矩阵+旋转):
<g id="g5600" style="display:inline;" transform="matrix(0.64633527,-0.76305355,0.76305355,0.64633527,-257.64528,53.75293) rotate(45,155.6640625,382.421875)">...</g>
我已经尝试过这段代码并且它有效,但我认为这不是最好的解决方案。
store.g5600.transform('matrix', '0.64633527,-0.76305355,0.76305355,0.64633527,-257.64528,53.75293').animate(2000).rotate(45);
所以我的问题是如何附加(或前置)转换。顺便说一句,我认为在拉斐尔这是通过使用:
el.transform("...t50,50");
el.transform("s2...");