CamanJS in SVG?

Question

我希望使用 CamanJS (http://camanjs.com/guides/( 或其他类似工具对<svg>元素中的图像进行一些客户端图像处理。

示例代码是这样的...

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="624" height="793" id="svg_3162" style="width: 639px;">
<desc>Created with Rapha�l</desc>
<defs></defs>
<rect x="15" y="150" width="24" height="24" r="0" rx="0" ry="0" fill="#ff0000" stroke="none"></rect>
<rect x="7" y="174" width="24" height="24" r="0" rx="0" ry="0" fill="#000000" stroke="none"></rect>
MORE SVG STUFF
<image x="35" y="0" width="600" height="769" preserveAspectRatio="none" xlink:href="https://s3.amazonaws.com/path/to/image.jpg"></image>
MORE SVG STUFF
</svg>

它到达<svg>标签中的<image>标签似乎是问题所在。 有谁知道 CamanJS 是否可以使用它？ 或者，如果有类似的东西可以在这种情况下工作？

Answer 1

使用异物并设置高度、宽度、x 和 y 位置

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="624" height="793" id="svg_3162" style="width: 639px;">
<desc>Created with Rapha�l</desc>
<defs></defs>
<rect x="15" y="150" width="24" height="24" r="0" rx="0" ry="0" fill="#ff0000" stroke="none"></rect>
<rect x="7" y="174" width="24" height="24" r="0" rx="0" ry="0" fill="#000000" stroke="none"></rect>
MORE SVG STUFF

更多SVG的东西