创建自定义d3布局

我需要创建一个自定义d3布局，该布局有点接近树形图，但采用三角形样式。下面是截图，让你可以了解： enter image description here Pyramid layout 创建自定义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; 
     return pyramid; 
    }; 

    return d3_layout_hierarchyRebind(pyramid, hierarchy); 
};

我的问题是，这样做，我不得不直接编辑0文件，因为一些私人的功能是不可访问从outisde，在我的案例d3_layout_hierarchyRebind。很明显，我知道这不是最好的做法，但我无法设法将文件外部化在单独的脚本中，因为d3_layout_hierarchyRebindis从外部不可见。

我不知道这是一个d3或javascript相关的问题，但我想知道你是否可以帮我解决这个小问题。

提前致谢！

来源

2012-11-08 user1804450

它看起来像d3.js只是没有设计具有外部定义的布局。您可以将您编写的布局合并到d3.js的自定义版本中。我看不出有其他办法可以做到这一点。 – fuzic

好问题和评论 - 观察到同样的问题。它从获得d3_identity开始...... – andig

正如@ZachB指出的那样，您可以在不使用D3名称空间的情况下创建布局。布局只是一个可配置的函数，它接收数据并返回转换后的数据，这正是您的功能所做的。 –

只需将d3.layout.pyramid函数复制并粘贴到新文件中，并根据需要重命名函数，以免它与d3库冲突。有可能所有东西都是私人的，所以只有最外面的功能需要重新命名。您可能不必将其命名为“d3”。也就是说，这应该工作：

var myPyramidLayout = function() { 
    ... 
}

来源

2013-03-19 01:25:06 ZachB

创建自定义d3布局

回答

相关问题