mxGraph（二）-model

短命女 2023-07-25 14:10 9阅读 0赞

# mxCell #

Cells are the elements of the graph model.  They represent the state of the groups, vertices and edges in a graph.

单元格是图模型的元素。它们表示图中的组，顶点和边的状态。

一下是创建了一个以xml节点为值得单元格

var doc = mxUtils.createXmlDocument();
    var node = doc.createElement('MyNode')
    node.setAttribute('label', 'MyLabel');
    node.setAttribute('attribute1', 'value1');
    graph.insertVertex(graph.getDefaultParent(), null, node, 40, 40, 80, 30);

[官网][Link 1]

# mxCellPath #

var mxCellPath =
    {
    	PATH_SEPARATOR: '.',//定义路径组件之间的分隔符
    	create: function(cell) //创建给定单元格到单元格的路径
    	{
    		var result = '';
    		if (cell != null)
    		{
    			var parent = cell.getParent();
    			while (parent != null)
    			{
    				var index = parent.getIndex(cell);
    				result = index + mxCellPath.PATH_SEPARATOR + result;
    				
    				cell = parent;
    				parent = cell.getParent();
    			}
    		}
    		var n = result.length;
    		if (n > 1)
    		{
    			result = result.substring(0, n - 1);
    		}
    		return result;
    	},
    	getParentPath: function(path) //返回给定路径的单元格父级的路径
    	{
    		if (path != null)
    		{
    			var index = path.lastIndexOf(mxCellPath.PATH_SEPARATOR);
    			if (index >= 0)
    			{
    				return path.substring(0, index);
    			}
    			else if (path.length > 0)
    			{
    				return '';
    			}
    		}
    		return null;
    	},
    	resolve: function(root, path) //使用给定的根作为路径的根。
    	{
    		var parent = root;
    		if (path != null)
    		{
    			var tokens = path.split(mxCellPath.PATH_SEPARATOR);
    			for (var i=0; i<tokens.length; i++)
    			{
    				parent = parent.getChildAt(parseInt(tokens[i]));
    			}
    		}
    		return parent;
    	},
    	compare: function(p1, p2) //比较单元格的路径，哪个小返回哪个
    	{
    		var min = Math.min(p1.length, p2.length);
    		var comp = 0;
    		for (var i = 0; i < min; i++)
    		{
    			if (p1[i] != p2[i])
    			{
    				if (p1[i].length == 0 ||
    					p2[i].length == 0)
    				{
    					comp = (p1[i] == p2[i]) ? 0 : ((p1[i] > p2[i]) ? 1 : -1);
    				}
    				else
    				{
    					var t1 = parseInt(p1[i]);
    					var t2 = parseInt(p2[i]);
    					
    					comp = (t1 == t2) ? 0 : ((t1 > t2) ? 1 : -1);
    				}
    				
    				break;
    			}
    		}
    		
    		// Compares path length if both paths are equal to this point
    		if (comp == 0)
    		{
    			var t1 = p1.length;
    			var t2 = p2.length;
    			
    			if (t1 != t2)
    			{
    				comp = (t1 > t2) ? 1 : -1;
    			}
    		}
    		
    		return comp;
    	}
    
    };

# mxGraphModel  #

请看官网。。。或者联系管理员要思维导图

qq：918922703

# **mxGraphModelQQ** #

# **mxGraphMo** #

[Link 1]: http://jgraph.github.io/mxgraph/docs/js-api/files/model/mxCell-js.html

发表评论取消回复

表情：

评论列表（有 0 条评论，9人围观）

还没有评论，来说两句吧...

相关阅读

相关【自然语言处理 | Language Models】Language Models 常见算法介绍合集（二）

文章目录一、ALBERT 二、LLaMA 三、OPT 四、DistilBERT 五、ELECTRA

朱雀/ 2023年10月16日 10:48/ 0 赞/ 52 阅读

相关 mxGraph（二）-model

mxCell Cells are the elements of the graph model. They represent the state of the gr

短命女/ 2023年07月25日 14:10/ 0 赞/ 10 阅读

相关 mxGraph学习（一）简介

mxgraph图表库 1.概述该JavaScript库分为8个包。顶级mxClient类包含（或动态导入）其他所有内容。当前版本存储在mxClient.VERS

清疚/ 2023年05月28日 14:27/ 0 赞/ 14 阅读

相关 MxGraph从入门到精通之5：在Vue项目中使用MxGraph

第一步：安装npm包 npm install mxgraph 第二步：在mxgraph.vue中使用mxgraph <template>

た入场券/ 2023年02月22日 12:25/ 0 赞/ 25 阅读

相关 MxGraph从入门到精通之4：布局

文章目录 mxCircleLayout-圆形布局 mxCompactTreeLayout-树状布局 mxFastOrganicLayout-组织状布局

偏执的太偏执、/ 2023年02月21日 04:47/ 0 赞/ 22 阅读

相关 Activiti系列（二）集成Activiti Modeler

[2019独角兽企业重金招聘Python工程师标准>>> ][2019_Python_] ![hot3.png][] [https://blog.csdn.net/h1059

Love The Way You Lie/ 2022年10月02日 05:53/ 0 赞/ 306 阅读

相关 mxGraph使用经验总结

mxGraph是一个支持多种语言（Java、JavaScript、PHP、.NET）的画图框架，所绘制的图形可以在主流浏览器以及原生应用上使用。 mxGraph官方资料全英文，

男娘i/ 2022年10月01日 06:52/ 0 赞/ 372 阅读

相关 mxgraph在线画UML图

在线画UML图, mxgraph [http://jgraph.github.io/mxgraph/javascript/examples/grapheditor/www/i

r囧r小猫/ 2022年09月23日 05:48/ 0 赞/ 323 阅读

相关 MVC-Model数据注解（二）-自定义

由于系统的数据注解肯定不适合所有的场合，所以有时候我们需要自定义数据注解。自定义数据注解有两种，一种是直接写在模型对象中，这样做的好处是验证时只需要关心一种模型对象的验证逻

梦里梦外;/ 2021年12月15日 10:13/ 0 赞/ 220 阅读

相关 JSP开发模式--Model 2模式（二）

Model 2模式，即为JSP+JavaBeans+Servlet模式，这是因为该模式在开发中将显示数据、控制页面跳转、数据层操作分别交给JSP、Servlet 、java

灰太狼/ 2021年09月23日 06:10/ 0 赞/ 495 阅读