html左侧树形图,Qunee for HTML5 - 中文 : 树形布局

本文介绍了HTML5中实现树形布局的方法,包括布局参数设置,如层次间排列方向、同层节点之间的排列方式,以及如何通过Qunees库创建和配置树形布局的示例代码。
摘要由CSDN通过智能技术生成

树图是一种常见的拓扑图结构,通常用来表现层次结构,组织图,从属关系等,树形结构通常通过父子关系形成,也可以通过拓扑连接关系形成

树形布局按传统的分支树分布,可设置层次间排列方向,同层节点之间的排列方式等,组合实现各种树形布局效果

9d4ba02fe7c11d9f2954eb7cf036bca6.png

de473e65cab474f220332483a5509fd9.png

布局参数

主要提供两个参数,分别控制层次之间与同层间的布局效果,可以设置给布局器对象或者节点属性,前者全局生效,后者对单个分支起作用:

比如设置全局布局方向为从下往上,可以使用下面的代码:

layouter.parentChildrenDirection = Q.Consts.DIRECTION_TOP;

#parentChildrenDirection- 层次间布局方向

支持上下左右中等方向:Q.Consts.DIRECTION_RIGHT  - 向右布局

Q.Consts.DIRECTION_LEFT - 向左布局

Q.Consts.DIRECTION_CENTER - 水平居中布局

Q.Consts.DIRECTION_BOTTOM - 向下布局

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值