mxGraph进阶(三)Web绘图——mxGraph项目实战(精华篇)

网友投稿 613 2022-05-30

Web绘图——mxGraph项目实战(精华篇)

声明

本文部分内容所属论文现已发表,请慎重对待。

需求

由于小论文实验需求,需要实现根据用户日志提取出行为序列,然后根据行为序列生成有向图的形式,并且连接相邻动作的弧上标有执行此次相邻动作的频次,每个动作另附有一个数据集,这样有向图加数据集就构成了用户交互图。为此,自己想到了mxGraph,遂决定学习之。

起步

此次项目实战是受阅读参考文献[1]启发,并在其图形布局实例基础上进行。其原始界面如图1所示,自己要实现的界面布局与之颇有几分神似。只是该布局界面不支持节点与边的定制,为此需要结合经典的“Hello world”实例,其原始界面布局如图2所示。

图1 graphlayout实例

图2 Hello World!实例

由于自己是零基础开始学习这一Web绘图框架,首先是阅读其源码。有关mxgraph的启动加载原理及其元素了解,请阅读《mxgraph的初步介绍与开发入门》、《mxGraph教程-开发入门指南》两篇博文。

实例1源码阅读

图形布局