摘要由AI智能服务提供mxGraph是一个基于Javascript的web绘图应用，支持流程图、图表等图形的设计与编辑。其包结构分为多个模块，如editor、view、model等，涵盖图形编辑的各个方面。事件处理包括DOM、mxEventSource及mxMouseEvents等。配置、保留字、内置图像及资源文件均有详细规定，具体信息可查阅官方文档及GitHub地址。
一、简介
mxGraph是一个用Javascript编写的绘图web应用程序，可以在网页中设计/编辑 流程图、图表、普通图形、UML图等等。可以使用 mxClient.VERSION查看mxGraph的当前版本，我用的是3.6.0.0版本。
二、mxGraph包结构
editor：包含一些实现图形编辑器必须的类，主类为：mxEditor。 view、model：包中实现了graph的组件，以mxGraph为代表。mxGraphModel包含多个mxCell，并通过mxGraphView缓存cells的状态。cells通过mxCellRenderer基于mxStylesheet提供的样式绘制。mxUndoManager实现重做操作，mxCellOverlay在画布上显示一个图标(icon)时可能被用到。验证规则在mxMultiplicity中定义。 handler、layout、shape：分别包含事件监听、布局算法和图形。图形事件监听包括：mxRubberband实现框线选择，mxTooltipHandler实现提示(tooltip)，mxGraphHandler实现基础的cell的修改；mxCompactTreeLayout实现一种树形布局算法；shape包下提供了各种图形，它们都是mxShape的子类。 util：提供多功能的工具类，包括：mxClipboard提供粘贴、复制功能，mxDatatransfer提供拖拽功能，mxConstants提供样式的key和value，mxEvent、mxUtils提供跨浏览器事件处理和通用的工具函数，mxResource提供国际化支持，mxLog提供控制台输出。 io：提供一个通用的mxObjectCodec类将Javascript对象转换为XML，主要的类是mxCodec，mxCodecRegistry是注册自定义转换器的全局注册器。
三、mxGraph事件
mxGraph中的事件主要包括：
1、原生DOM事件，mxEvent中提供了一些有用的方法； 2、用mxEventSource触发的mxEventObjects； 3、在mxGraph中触发的mxMouseEvents；
mxGraph中的大多数事件的实现是使用mxEventSource，它的监**发送了mxEventObject的函数。另外，mxGraph类中触发特有的mxMouseEvents去处理鼠标事件。
四、mxGraph配置
以下的全局变量可以在客户端加载前指定language、base path等。
mxBasePath: mxClient.basePath mxImageBasePath: mxClient.imageBasePath mxLanguage: mxClient.language mxDefaultLanguage: mxClient.defaultLanguage mxLoadResources: 指定所有的资源是否都应该被加载，默认是true。 mxLoadStylesheets:指定所有的样式是否都应该被加载，默认是true。
五、mxGraph保留字
mx前缀被用来作为mxGraph中所有类和对象的前缀。以下的字段不能在对象中使用：
1、mxObjectId； 2、as； 3、id； 4、mxListenerList； 5、window._mxDynamicCode； 6、_mxJavaScriptExpression。
六、mxGraph内置图像
所有的图象都是从mxClient.imageBasePath路径加载，此路径以及以下图象变量都可以按需修改。
mxGraph.prototype.collapsedImage mxGraph.prototype.expandedImage mxGraph.prototype.warningImage mxWindow.prototype.closeImage mxWindow.prototype.minimizeImage mxWindow.prototype.normalizeImage mxWindow.prototype.maximizeImage mxWindow.prototype.resizeImage mxPopupMenu.prototype.submenuImage mxUtils.errorImage mxConstraintHandler.prototype.pointImage
七、mxGraph资源文件
mxEditor、mxGraph在类加载时给mxResources添加以下资源：
resources/editor*.properties resources/graph*.properties
八、参考资料
mxGraph官方文档：http://jgraph.github.io/mxgraph/
github地址：https://github.com/jgraph/mxgraph
