echart 流程图

ECharts（Enterprise Charts）是百度开源的一个数据可视化库，它提供了各种类型的图表，包括流程图。下面是绘制 ECharts 流程图的基本流程：

1. 引入 ECharts 库：在 HTML 文件中引入 ECharts 的 JavaScript 文件。可以通过下载文件或直接使用 CDN 引入。

2. 创建容器：在 HTML 文件中创建一个容器元素，用于显示流程图。

3. 初始化图表：使用 JavaScript 代码创建一个 ECharts 实例，并将其与容器关联起来。

var myChart = echarts.init(document.getElementById('container'));

4. 配置图表选项：通过配置各种选项来定义流程图的样式和数据。ECharts 提供了丰富的配置选项，可以设置节点、连线、文本样式等。

var option = {
  series: [
    {
      type: 'graph',
      layout: 'none',
      symbolSize: 40,
      data: [
        { name: '节点1', x: 100, y: 100 },
        { name: '节点2', x: 300, y: 100 },
        // 其他节点...
      ],
      links: [
        { source: '节点1', target: '节点2' },
        // 其他连线...
      ],
    },
  ],
};

5. 渲染图表：使用 setOption 方法将配置应用到图表实例上，并在页面中显示出来。

myChart.setOption(option);

以上是一个简单的 ECharts 流程图的绘制流程。你可以根据实际需求进行更详细的配置，包括节点样式、连线样式、文本样式等。更多信息可以参考 ECharts 官方文档。