将现有的SVG或HTML5元素添加到Box2D World

cir*_*rus 6 html5 animation svg gravity box2d

我有一个SVG标志,主要由元素组成.我希望为此制作动画,或者更具体地说,将其放入"重力世界".我希望使用Box2D(网络端口).

我真的是Box2D和Canvas的菜鸟,但我已经使用canvg将我的SVG转换为HTML5画布了,我现在正在阅读Box2dWeb的入门教程,我可以看到如何创建一个世界引力,但我找不到任何走现有SVG或Canvas的例子,只是简单地将形状添加到那个世界.

看起来你需要使用Box2D绘图方法.任何人都可以指出一个简单的例子,它采用现有的一组形状(SVG或Canvas)并简单地将它们放到Box2DWeb引力世界中,这样它们就会崩溃到底部,就像几乎所有现有的Box2D演示和教程一样?

请注意,使用CanVG我不是自己将形状添加到Canvas,它是从SVG为我创建Canvas.

cir*_*rus 1

我一直希望有人能够通过赏金为我演示“重力演示”的“你好世界”,它可以为一些任意形状赋予动画效果。到目前为止,我所看到(和发现)的文章和链接比我正在寻找的要复杂得多。

虽然我不想回答自己的问题,但我只是想设定一个标准。这正是我正在寻找的;

http://mrdoob.com/projects/chromeexperiments/google-gravity/

此代码的脚本已获得 GPL3 许可,我了解并且我已在我的网站上成功尝试过它。事实上,它只会导致我页面上的所有 DIV 丢失,所以它只是票证,我可以使用它。

然而,这不是一个简单的脚本。如果可能的话,我更喜欢一个简单的独立示例。如果做不到这一点,希望这个答案能帮助其他人寻找类似的东西。

[更新]

我也找到了这个插件,尽管它对我来说有点 CPU 密集型并且崩溃了 Chrome。

http://tinybigideas.com/plugins/jquery-gravity/

我仍然很高兴为任何更好的答案提供赏金。