小编use*_*450的帖子

创建自定义d3布局

我需要创建一个自定义的d3布局,它有点接近树形图但是采用三角形样式.这是一个截图,以便您可以理解: 在此输入图像描述 金字塔布局

正如你所看到的,它的工作非常整洁,符合我的需要.为了编码,我将代码基于树图布局代码:

d3.layout.pyramid= function () {
    var hierarchy = d3.layout.hierarchy(), round = Math.round, size = [ 1, 1 ], padding = 0;

    function populate (nodes, currentHeight, currentHeightPadded, currentBase, currentSumedWeight) {
       ...
    }

    function populate_layers (layer, nodes,currentHeight,currentLength, currentSumedArea,currentSumedWeight) {
       ...
    }

    function pyramid(d) {
       var nodes = hierarchy(d), root = nodes[0];

       populate(root.children.slice(),0,0,0,0);
       return nodes;
    }  

    pyramid.padding = function(x) {
       if (!arguments.length) return padding;
       padding = x;
       return pyramid;
    };

    pyramid.size = function(x) {
       if (!arguments.length) return size;
       size = x; …
Run Code Online (Sandbox Code Playgroud)

javascript layout treemap d3.js

12
推荐指数
1
解决办法
3186
查看次数

标签 统计

d3.js ×1

javascript ×1

layout ×1

treemap ×1