本期我们开始搭建一个简单的图形编辑器。介绍开发环境搭建和 X6 创建画布、键盘快捷键功能实现。文章内容将根据实际情况不断补充。

设计器的实现的功能为，从节点库中将所需节点拖拽入流程面板中，在面板中可进行删除，移动，连线等操作，选中节点/操作后，可对其data中挂载的内容进行配置，未选中时对流程自身属性进行配置，以及JSON输出

X6 脱胎于蚂蚁实际的业务场景，在此基础上，我们完善了图编辑场景的常用扩展，如小地图、网格系统、对齐线、框选、redo/undo等，内置了图编辑场景的常规交互和设计，如群组、链接桩、节点缩放、旋转、连线交互，并提供了基于 HTML 和 React 低成本定制节点能力。 只需要掌…

本文介绍了如何创建 适用于 X6 的自定义元件库。通过分析开关的示例，详细解析如何创建一个自定义组件。

流程图可以清晰的可视化展示组织、工作流等复杂层次结构。在后面的一系列文章中，将会从 0 到 1 完成一个流程图应用的开发，这篇文章主要是做技术选型。