d3.js用于显示工作流运行时状态

Question

我们希望以图形方式描述正在运行的工作流程的状态。例如，在下面的屏幕截图中，呈现了工作流的运行时状态。活动下方的绿色小框表示活动已处理 -

我需要为工作流程系统实现类似的功能。用户需要查看工作流的运行时状态（流程中的所有活动）以及哪些活动已经完成。

我希望使用D3 Visualization API来实现这一目标。我有几个问题 -

1. 是免费还是需要许可
2. D3可以实现这样的目标吗？我在看这些例子，但找不到类似的东西

https://github.com/mbostock/d3/wiki/Gallery

1. 任何其他更适合此类要求的API

感谢您的期待。

Answer 1

我有类似的要求，我能够使用d3制作这种图表：

您可以找到相同here的代码。

在这里我使用了自举面板作为每个州的内容，我们可以通过调整一些代码来改变盒子的位置和箭头的方向来满足你的要求。

如果需要，我可以帮助您进一步修改代码。

希望这会有所帮助:)。

Answer 2

您应该意识到，与Highcharts不同，例如，D3不是图形或可视化的集合。它是一个库（就像jQuery一样），允许您从头开始创建所述可视化。

现在，回答你的问题：

1.   

   是免费还是需要许可

   如d3js.org底部所述：

     

   图书馆在BSD license下发布。版权所有2013 Mike Bostock。

   BSD 3条款许可证上的wikipedia article声明：

     

   此版本允许无限制地再分发用于任何目的，只要其版权声明和许可证的免责声明得以维持。许可证还包含一项条款，该条款限制使用贡献者的名称以在未经特别许可的情况下认可衍生作品。

2.   

   可以在D3中实现这样的事情吗？我正在查看这些示例，但无法找到类似的

   是的，这可以实现。您可能会在this directed graph editor example中找到一些灵感。

3.   

   任何其他更适合此类要求的API

   对于简单的情况，D3本身就足够了。