使用svg.js加载和转换并嵌入SVG文件

Question

我使用svg.js库来加载svg文件，添加其点（图像）并为点设置动画。我在PHP中加载svg文件并生成代码以将其嵌入到html中。

以下是我的html代码的外观：

<div class="svg-element">
    <svg id="svgId" ...>
        <!-- SVG code -->
    </svg>
</div>

这是我的javascript代码的外观：

var svg = SVG.get('svgId');
svg.size('100%', '100%');

var point = svg.image(point_url);
point.attr('id', 'pointId');
point.move(100, 100);

该代码完美无缺，但当我使用scale()函数对点进行缩放效果时会出现问题。

point.scale(0.5);

或transform功能：

point.transform({scaleX : '0.5', scaleY : '0.5'});

javascript控制台中显示TypeError: SVG.parser is undefined错误。

如何避免该问题并将变换方法与图像一起使用？问题可能是我使用.get()函数，如何使用svg文件创建SVG对象？

Answer 1

解决方案很简单：

var svg = SVG('svgId');

而不是使用.get()函数。

您必须将SVG()构造函数与SVG ID一起使用，而不是.get()函数，我对此感到困惑，因为this answer表示您可以使用.get()检索SVG。