mxGraph源码学习
文章平均质量分 71
记录阅读mxGraph源码的过程中的一些理解
remo0x
no one
展开
-
【mxGraph】源码学习:(1)mxGraph库
基于 mxGraph 3.9.91. mxGraph简介mxGraph是一个JavaScript图表库,可以快速创建交互式图形和图表应用程序,这些应用程序可以在其供应商支持的任何主要浏览器中运行。mxGraph在2005年创建,作为商业项目一直持续到2016年,由于前端有很多新技术出现,所以mxGraph作为封装库的优势渐渐消失,最后创建者开明的以Apache 2.0开源协议在GitHu...原创 2018-10-11 18:21:51 · 4352 阅读 · 0 评论 -
【mxGraph】源码学习:(2)mxClient
1. mxClient文件mxClient.js是客户端的引导机制,此文件include了运行mxGraph所需的所有源文件,并加载了其依赖的资源文件,以及配置了客户端的语言。意思就是只要在需要使用mxGraph的地方用<script>标签加载mxClient.js即可使用该库。这是一种非常好的做法,不仅能方便的进行开发,还能提供mxClient的压缩版本以提升加载速度。mxCl...原创 2018-10-12 17:14:26 · 4759 阅读 · 1 评论 -
【mxGraph】源码学习:(3)mxResources
前面学习mxClient源码的时候,见过这个类的使用,主要是用于加载资源文件用于实现客户端的国际化1. 资源文件格式可以使用如下格式命名资源文件,比如graph_zh.txt:文件名:name[_en].properties如果没有下划线,表示其为默认加载的资源文件。如果客户端使用的语言存在对应的资源文件,则将加载该文件。资源文件中的项是key=value的格式,值可能会通过get...原创 2018-10-12 21:35:53 · 2665 阅读 · 0 评论 -
【mxGraph】源码学习:(4)mxEventSource
mxGraph继承自mxEventSource,所以首先了解一下mxEventSource这个类。1. 作用mxEventSource是分派命名事件的对象的基类,采用原型链方式继承,如下所示:function MyClass() { };MyClass.prototype = new mxEventSource();MyClass.prototype.constructor = My...原创 2018-10-12 22:40:05 · 1823 阅读 · 1 评论 -
【mxGraph】源码学习:(5)mxGraph
由于mxGraph源文件有一万多行,且涉及很多其它源文件,所以会省略一些次要内容1. 概览mxGraph继承自mxEventSource以实现基于Web的图形组件。要激活平移和连接,请使用setPanning和setConnectable。对于橡皮带选择,您必须创建一个新的mxRubberband实例。默认情况下,以下侦听器添加到mouseListeners:tooltipHandle...原创 2018-10-14 17:46:15 · 7408 阅读 · 2 评论 -
【mxGraph】源码学习:(6)mxGraphModel
mxGraphModel用于存储mxGraph中cell的状态,具有一些很重要的功能1. 概览mxGraphModel继承自mxEventSource以实现graph model。graph model是负责存储graph数据结构的包装器。graph model充当事务包装器,其中包含所有更改的事件通知,而cell包含用于更新实际数据结构的原子操作。1.1 图层模型中的cell层次结构...原创 2018-10-15 17:03:46 · 3629 阅读 · 0 评论 -
【mxGraph】源码学习:(7)mxCell
1. 概览mxCell是graph model的元素。它们表示graph中的group、vertex和edge的状态。对于自定义属性,建议使用XML节点作为cell的值。以下代码可用于创建具有XML节点的cell作为值:var doc = mxUtils.createXmlDocument();var node = doc.createElement('MyNode')node.setA...原创 2018-10-15 17:28:40 · 4282 阅读 · 0 评论