Creazione di un layout d3 personalizzato

Question

Devo creare un layout d3 personalizzato che sia in qualche modo vicino a una mappa di tre ma in uno stile triangolare. Ecco uno screenshot in modo che tu possa capire: Pyramid layout

Come si può vedere, funziona abbastanza carino e si adatta il mio bisogno. Per codificare esso, ho basato il codice a codice del layout treemap:

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); 
}; 

Il mio problema è, per farlo, ho dovuto modificare direttamente il file d3.v2.js, perché alcune funzioni private non sono accessibili da outisde, nel mio caso d3_layout_hierarchyRebind. Chiaramente, so che non è la migliore pratica, ma non riesco a esternalizzare il mio file in uno script separato, perché lo d3_layout_hierarchyRebindis non è visibile dall'esterno.

Non so se si tratta di un problema relativo a d3 o javascript, ma mi piacerebbe sapere se potresti aiutarmi a risolvere questo piccolo problema.

Grazie in anticipo!

Answer 1

Basta copiare e incollare la funzione d3.layout.pyramid in un nuovo file e rinominare le funzioni come necessario in modo che non sia in conflitto con la libreria d3. Probabilmente tutto sarà privato, quindi sarà necessario rinominare solo la funzione più esterna. Probabilmente non dovrai assegnare il namespace a "d3". Vale a dire, questo dovrebbe funzionare:

var myPyramidLayout = function() { 
    ... 
}