我在版本 4 中使用 Windows 工作流基础。我想问一下是否有任何方法可以使用 html5 和 js 在网站上简单地显示/可视化工作工作流实例。我不想使用重新托管设计器。我找到了WorkflowInspectionServices 类，但老实说，从中提取工作流图结构并不容易（不同的处理并行活动或流程图）。工作流跟踪系统是发现工作流实例状态/进度的唯一方法吗？
有人试过类似的吗？任何想法都会有所帮助。
【问题讨论】：
标签： workflow-foundation-4 visualization
WorkflowDesigner 是一个 WPF 组件，因此不能很好地与 HTML 配合使用，但由于您不想使用它，我猜它不是很重要，尽管您可以使用它来生成工作流的图像并在浏览器中显示它.我不知道有任何查看器将工作流定义转换为 HTML 结构。 XAML 只是 XML，因此它肯定是可能的，但我怀疑这将是一个简单的练习，因为您必须至少复制所有活动设计器的一部分。
【讨论】：
考虑使用a Sankey Diagram 来帮助可视化工作流程。
我见过用于描述工作流程的层次结构图，但一直认为它们缺少某些东西——例如，可以有两个父节点的节点。桑基图解决了这个问题，and 提供了一种简单的方法来介绍“节点”之间移动量的概念。此外，根据定义，a flowchart is "a type of diagram that represents a workflow or process"。桑基图看起来比层次图流动得多。
欲了解更多信息，请查看David Pallmann's convincing case for using Sankey diagrams to visualize workflow。
我能够在 10 分钟内创建 this workflow visualization，方法是派生 the Highcharts's Sankey demo 并将系列数据自定义为以下内容：
data: [
['Event Submission', 'Event Submission Close', 250],
['Event Submission', 'Create Incident', 750],
['Event Submission Close', 'Approve', 240],
['Event Submission Close', 'Reject', 10],
['Approve', 'After Action Review', 640],
['Create Incident', 'Contained', 400],
['Create Incident', 'Provide Analysis', 150],
['Create Incident', 'Incident Close', 125],
['Contained', 'Containment Approval', 370],
['Contained', 'Containment Rejection', 30],
['Incident Close', 'Approve', 110],
['Incident Close', 'Reject', 15],
['Containment Approval', 'Eradicated', 320],
['Containment Approval', 'Provide Analysis', 50],
['Eradicated', 'Eradication Approval', 315],
['Eradicated', 'Eradication Rejection', 5],
['Eradication Approval', 'Recovered', 315],
['Eradication Approval', 'Provide Analysis', 5],
['Recovered', 'Approve', 310],
['Recovered', 'Reject', 5]
]
【讨论】：