在 AS3 / Processing / D3 中沿多个贝塞尔路径动画相机？

Question

我有一个使用 Gephi 生成的网络图可视化，其中包含许多节点和边。我需要制作摄像机（或移动影片剪辑）的动画，以沿着贝塞尔曲线的路径“飞越”网络，随机访问每个（不一定是每个）节点。我制作了what this would look like 的快速动画。

如何通过 AS3 或 Processing 或使用 github 上的 mbostock D3 javascript 库以编程方式实现此目的？

到目前为止，我在 AS3 中的尝试是使用 Miller H. Borges Medeiros' tool 将 gephi 生成的 SVG 转换为 AS3 代码，然后尝试调整贝塞尔补间库，例如 Zeh Fernando 的示例，但我遇到了困难。

Medeiros 的转换器将二次贝塞尔曲线拆分为 4 个单独的二次贝塞尔曲线，我不确定如何将 flash 的 curveTo 方法转换为 Fernando 代码中的贝塞尔曲线点数组。

然后是只通过那些相互连接的节点来动画相机的问题。

有什么想法吗？ 谢谢你的帮助！！..

Answer 1

我之前没有使用过 Gephi，但我之前确实回答过 similar question。 任务是为从 Illustrator 导出的路径上的对象设置动画。 我的解决方案是使用 FXG 和 LibSpark as3 FXGParser 并自定义类库以将路径坐标导出为 TweenLite 补间。

这可以应用/适应您的示例，但可能使用SvgParser：

svn export http://www.libspark.org/svn/as3/SvgParser

我更喜欢TweenLite，因为它是最新的（Tweener 不再被开发）。 如果您更喜欢 Tweener，同样的原则也适用，因为两个补间库都使用二次贝塞尔曲线进行路径动画。你可以找到更多关于 Tweener 路径动画here。如果有帮助，wonderfl 还有另一个example。

只要你有曲线坐标（你提到你可以使用curveTo绘制），你也可以在这些曲线上进行补间。