js画图开发库--mxgraph--[tree-树形结构图.html]

最新推荐文章于 2021-03-11 16:30:30 发布

VIP文章 iteye_17920

最新推荐文章于 2021-03-11 16:30:30 发布

阅读量1.3k

点赞数

分类专栏： mxgraph 文章标签： js画图开发库 mxgraph tree 树形结构图

本文链接：https://blog.csdn.net/iteye_17920/article/details/82480441

版权

js画图开发库--mxgraph--[tree-树形结构图.html]

<!Doctype html>
<html xmlns=http://www.w3.org/1999/xhtml>
	<head>
	<meta http-equiv=Content-Type content="text/html;charset=utf-8">
	<title>工具栏</title>

	<!-- 如果本文件的包与src不是在同一个目录,就要将basepath设置到src目录下 -->
	<script type="text/javascript">
		mxBasePath = '../src';
	</script>

	<!-- 引入支持库文件 -->
	<script type="text/javascript" src="../src/js/mxClient.js"></script>
	<script type="text/javascript">
		/*
			定义一个树节点
		*/
		function TreeNodeShape() { };

		TreeNodeShape.prototype = new mxCylinder();
		TreeNodeShape.prototype.constructor = TreeNodeShape;

		// 定义的上边缘部分的长度。
		TreeNodeShape.prototype.segment = 20;

		// 根据状态显示元素
		TreeNodeShape.prototype.apply = function(state)
		{
			mxCylinder.prototype.apply.apply(this, arguments);
			this.state = state;
		};
		
		TreeNodeShape.prototype.redrawPath = function(path, x, y, w, h, isForeground)
		{
			var graph = this.state.view.graph;
			var hasChildren = graph.model.getOutgoingEdges(this.state.cell).length > 0;
			
			if (isForeground)
			{
				if (hasChildren)
				{
					// 这里使用的是元素范围外边距
					path.moveTo(w / 2, h + this.segment);

最低0.47元/天解锁文章

iteye_17920

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
js画图开发库--mxgraph--[tree-树形结构图.html]

js画图开发库--mxgraph--[tree-树形结构图.html] &lt;!Doctype html&gt;&lt;html xmlns=http://www.w3.org/1999/xhtml&gt; &lt;head&gt; &lt;meta http-equiv=Content-Type content="text/html;charset=utf-...
复制链接

扫一扫