用于HTML-JavaScript动画的简单SVG绘图

时间:2011-06-15 09:42:32

标签: javascript html animation svg inkscape

我正在尝试在SVG中绘制一个简单的电池符号,它将使用HTML / JavaScript进行动画处理:

http://pastebin.com/utM4BTRS

我想在SVG内部的“电池电平”绘图上动态操作掩码,但掩码不会在Inkscape中显示。 Firefox和Webkit都只展示了该部分的一小部分(还没有涉及JavaScript):

http://tinypic.com/view.php?pic=deu44m&s=7(左侧是Inkscape绘图,右侧是Firefox渲染)

因为我是SVG的新手:这里有什么问题?

1 个答案:

答案 0 :(得分:2)

除非您需要在遮罩中使用例如渐变,否则应尝试使用剪辑路径。实际上,如果你可以完全取消使用面膜,那就更好了。

现在,要回答您的问题,您可以从掩码元素中删除maskUnits="userSpaceOnUse",它将起作用。此外,您应该在导出时从inkscape保存为“Plain SVG”,这会使svg输出看起来更清晰。