簇布局

发布于 2019-12-21 21:23:05 字数 12679 浏览 921 评论 0 收藏 0

簇布局可以产生树状图：将树的叶节点放在同一深度的节点连接图。例如，簇布局可以用来在软件包层次结构中组织类：

同D3中的其他类一样，布局遵循方法链模式，在该模式下setter方法返回布局本身，允许使用简单语句调用多个setter。

d3.layout.cluster()

使用默认设置创建新的簇布局：默认排序为空；默认子访问器假定每个输入数据为带子数组的对象；默认分离函数在同层级使用一个节点宽度，在不同层级使用两个节点宽度；默认尺寸为1×1。

cluster(root)

cluster.nodes(root)

运行簇布局，返回节点数组及指定的根节点。簇数组为D3分层布局家族的一部分。这些布局具有相同的基本结构：布局的输入参数为分层的根节点，输出返回值为一个数组，表示计算过的所有节点的位置。每个节点都有各自属性：

• 上层-父节点，在根节点时为空。 • 下层-子节点数组，在叶节点时为空。 • 深度-节点深度，从根节点计算，值从0开始。 • x-节点位置的x坐标值。 • y-节点位置的y坐标。

虽然布局在x和y轴有值存在，但这表示一个任意坐标系；例如，可以将x坐标视为直径，将y坐标当做角，从而形成一个射线，而非笛卡尔坐标系布局。

cluster.links(nodes)

指定节点数组，如以节点形式返回的数组，返回对象节点表示每个节点中父节点同子节点之间的关系。叶节点没有任何关系。每个节点都是一个具有两个属性的对象：  source -父节点（如上述所示）。  target -子节点。该方法在获取一组关系描述时很有效果，通常与对角图形生成器共同使用。例如： svg.selectAll("path") .data(cluster.links(nodes)) .enter().append("path") .attr("d", d3.svg.diagonal());

cluster.children([children])

如果子节点已经指定，则设定子节点访问器函数。如未指定，则返回当前子节点访问器函数，该函数将输入数据默认为带子数组的对象： functionchildren(d){ returnd.children; }

通常，使用d3.json可以方便地加载节点分层，并将输入分层表示为一个嵌套JSON对象。例如： { "name":"flare", "children":[ { "name":"analytics", "children":[ { "name":"cluster", "children":[ {"name":"AgglomerativeCluster","size":3938}, {"name":"CommunityStructure","size":3812}, {"name":"MergeEdge","size":743} ] }, { "name":"graph", "children":[ {"name":"BetweennessCentrality","size":3534}, {"name":"LinkDistance","size":5731} ] } ] } ] }

在分层中，子访问器在根节点首先被调用。如果访问器返回值为空，则该节点在布局遍历结束时被假定为叶节点。否则，访问器需要返回数据元素数组，来表示子节点。

cluster.sort([comparator])

如已指定comparator，则使用指定的comparator函数设置布局中同级节点排序顺序。如comparator未指定，则返回当前分组的排序顺序，默认值为空。为每对节点，调用comparator函数。 comparator的默认值为空，此时采用三种遍历顺序，排序被禁用。例如，按照输入数据的字符串名对同层节点以降序顺序排序，即： functioncomparator(a,b){ returnd3.ascending(a.name,b.name); } See d3.ascending or d3.descending for details. 详见：d3.ascending或d3.descending

cluster.separation([separation])

如果已经指定separation，使用指定的函数计算相邻节点的间距。如果未指定separation，则返回当前间距函数。默认情况下，该函数为：存在一个更加适合于射线布局的变动，可以根据直径大小相应减少间距： functionseparation(a,b){ return(a.parent==b.parent?1:2)/a.depth; }

两个相邻节点a和b传递到separation函数，且必须返回节点间期望的间距。节点通常是同级的，虽然，这些节点也可能属于相近关系（或更远的关系），如果布局将这些节点临近放置的话。

cluster.size([size])

如果已经指定size，则将可用布局尺寸设定为指定的二元数组，以x和y来表示。如果尺寸没有指定，则返回当前尺寸，默认值为1×1，如果nodeSize正在使用中，则默认值为空。虽然布局在x和y轴都有数值，但该坐标系可以是任意坐标系。例如，创建一个射线布局，其中树的广度（x）用角度来测量, 树的深度（y）表示半径r, 单位为像素，即 [360, r]。