出现了一个问题,使用path定义的svg标记在缩放时无法正确对齐其位置。在谷歌提供的示例中可以看到这一点。
有趣的是,如果我们使用一个内置的svg符号,似乎就不会出现这个问题。
我正在使用此SVG路径作为我的标记,但它也存在对齐问题:
有趣的是,如果我们使用一个内置的svg符号,似乎就不会出现这个问题。
我正在使用此SVG路径作为我的标记,但它也存在对齐问题:
M 256,480c-84.828,0-153.6-68.157-153.6-152.228c0-84.081, 153.6-359.782, 153.6-359.782s 153.6,275.702, 153.6,359.782C 409.6,411.843, 340.828,480, 256,480z M 255.498,282.245c-26.184,0-47.401,21.043-47.401,46.981c0,25.958, 21.217,46.991, 47.401,46.991c 26.204,0, 47.421-21.033, 47.421-46.991 C 302.92,303.288, 281.702,282.245, 255.498,282.245z
这个问题的原因是什么?
编辑:感谢MrUpsidown解决了这个问题。SVG需要将其锚点设置为画布的(0,0)。
请参考此图片(我正在使用Illustrator,但任何其他SVG编辑应用程序都可以):
更新后的示例在这里:http://jsfiddle.net/tf83z/