我怎样才能为类似本例的“系统思维”图表制作动画？

Question

我喜欢这个基于 javascript 的系统思维图表工具版本。 它采用关系并计算其背后的值，然后沿着路径为一个点设置动画。

因此，在我进一步讨论之前，我将发布另一个关于理解系统的链接这里

问题

• 我怎样才能让 Visio 创建这些“动态图表”，以及如何使这个过程更容易？

例子：

Answer 1

尝试一下这个插件HTML 导出经过尼古拉

Answer 2

要在 Visio 中执行此操作，您必须编写自己的软件自动化程序来执行此操作。

本质上，你必须：

1. 编写代码将地图“解析”到内存中，基本上就是拾取节点和它们之间的连接器
2. 编写代码将连接器“像素化”为单个点（您只需对连接器形状调用 .points() 方法，它就会返回一个 xy 坐标数组）。然后，您必须将这些点下采样到正确的数量，以满足遍历该连接器所需的动画更新次数。
3. 编写一个动画例程，使一个或多个精灵沿着连接器前进，包括与您所建模的系统相关的任何逻辑。

导出为 SVG 并使用 javascript 制作动画可能是一种更合适的选择，但我认为编程应该类似。在网页上包含动画控件比在 Visio 页面上尝试执行此操作更容易。