力引导布局网络图(Force)简介
力引导布局网络图表现了不同数据元素之间的二元关系。 绘制Force-directed网络图的javascript代码如下:
//创建Force对象,包含于id为”chart”的dom结点,宽、高分别为700、500px。
var net = new DataV.Force("chart",{“width”: 700, “height”: 500});
//设置net选项,边的目标长度为100。
net.setOptions({“linkLength”: 100}); //options
//设置数据,输入的数据为一个二维数组。
net.setSource(source); //source is a 2-d array
//绘制
net.render();
创建Force对象时,第一个参数是包含Force的dom结点 或该结点的id, 第二个参数是各种选项,其中最重要的宽和高。
设置 Force选项时,可以设置如下属性:
width:画布宽度,默认500px
height:画布高度,默认500px
tag:是否有图例。默认true。
forceValue:代表引力大小,默认为10.
linkLength:代表边长度,默认50, 而一些边的长度在运动过程中会受到点之间作用力的影响而改变。
classNum:对节点