如何降低SVG的使用尺寸：动画技能图与拉斐尔

我采取了以下插件到我的网站http://tympanus.net/codrops/2011/04/22/animated-skills-diagram/comment-page-3/#comments 如何降低SVG的使用尺寸：动画技能图与拉斐尔

不幸的是使用SVG的设置宽度为600像素X 600像素。我试图将大小改写为350像素中较小的一个，但它不起作用。简单地切断了svg的一部分。任何人都可以给我建议如何使动画更小？

由于提前， EV陈

来源

2013-05-06 Ev Chen

您可以使用视框缩放SVG。设置SVG容器的大小，你想要的通常会导致裁剪，然后设置视框为600px的X 600px的，允许调整

http://raphaeljs.com/reference.html#Paper.setViewBox

paper.setViewBox(0, 0, 600, 600, true)

这将适合指定的区域（600 X 600）进入容器。

来源

2013-05-07 00:33:27

非常感谢您的快速回复。我通过插件提供的文件很好看，但不幸的是，我无法弄清楚，我必须放置paper.setViewBox。我真的很新，但很想使用这个插件，因为它非常适合我的项目。 – 2013-05-07 19:32:18

http://jsfiddle.net/Dj96k/ - 看到这个例子，它演示了setViewBox的基本用法。纸上绘制的圆圈为64像素×64像素，大于32像素×32像素的纸张尺寸。使用setViewBox我们可以改变显示的区域。在你提到的例子中，你会想做类似的事情： 'var r = Raphael（'diagram'，350,350）， rad = 73; r.setViewBox（0，0，600，600）;' – 2013-05-07 20:41:33

辉煌。非常感谢。这个例子确实有帮助。 – 2013-05-07 21:08:29

如何降低SVG的使用尺寸：动画技能图与拉斐尔

回答

相关问题