D3.js中d3.layout.force() 各个属性

1、force.tick():力学图抖动的过程,一直持续到下个静止状态;跟force.alpha()有一定关系,目前还不知道什么关系
见帖子:https://stackoverflow.com/questions/13463053/calm-down-initial-tick-of-a-force-layout
2,、常用到的几个函数:
size()
用于设定力学图的作用范围,使用方法为 force.size( [ x , y ] ),这个函数用于指定两件事:
重力的重心位置为 ( x/2 , y/2 )
所有节点的初始位置限定为 [ 0 , x ] 和 [ 0 , y ] 之间(但并非之后也是如此)
如果不指定,默认为 [ 1 , 1 ] 。
linkDistance()
指定结点连接线的距离,默认为20。如果距离是一个常数,那么各连接线的长度总是固定的;如果是一个函数,那么这个函数是作用于各连接线( source , target )的。
linkStrength()
指定连接线的坚硬度,值的范围为[ 0 , 1 ],值越大越坚硬。其直观感受是:
值为1,则拖动一个顶点A,与之相连的顶点会与A保持linkDistance设定的距离运动
值为0,则拖动一个顶点A,与之相连的顶点不会运动,连接线会被拉长
friction()
定义摩擦系数的函数,值的范围为[ 0 , 1 ],默认为0.9。但是这个值其实并非物理意义上的摩擦,其实其意义更接近速度随时间产生的损耗,这个损耗是针对每一个顶点的。
值为1,则没有速度的损耗。
值为0,则速度的损耗最大。
charge()
设定引力,是排斥还是吸引,默认值为-30。
值为+,则相互吸引,绝对值越大吸引力越大。
值为-,则相互排斥,绝对值越大排斥力越大。

chargeDistance()
设定引力的作用距离,超过这个距离,则没有引力的作用。默认值为无穷大。
gravity()
以 size 函数设定的中心产生重力,各顶点都会向中心运动,默认值为0.1。也可以设定为0,则没有重力的作用。
theta()
顶点数如果过多,计算的时间就会加大(O(n log n))。theta 就是为了限制这个计算而存在的,默认值为0.8。这个值越小,就能把计算限制得越紧。
alpha()
设定动画运动的时间,超过时间后运动就会停止。其实
force.start() 即 alpha(0.1)
force.stop() 即 alpha(0)
3、D3.js force力导向图用指定的字段确定link的source和target,默认是索引,也可以手动指定,如下:
https://stackoverflow.com/questions/23986466/d3-force-layout-linking-nodes-by-name-instead-of-index
defaultConfig.data.links.forEach(function (e) {
if(typeof e.source!=“number”&&typeof e.target!=“number”) {
var sourceNode = defaultConfig.data.nodes.filter(function (n) {
return n.name === e.source;
})[0],
targetNode = defaultConfig.data.nodes.filter(function (n) {
return n.name === e.target;
})[0];
e.source = sourceNode;
e.target = targetNode;
}
});
4、(1)selectAll()的作用:如selectAll(“line.link”)类似jQuery选择器,里面是根据元素、id或者class等选择元素;
(2)//d3.event.translate 是平移的坐标值,d3.event.scale 是缩放的值
(3)px, py:节点上一个时刻的坐标 x, y:节点的当前坐标 weight:节点的权重;
文本:dx- x 轴方向的文本平移量 dy- y 轴方向的文本平移量;
圆形:cx cy–圆心坐标,r–圆半径;
(4)force.start():该语句作用是对lines的数据补充坐标 weight等属性;

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值