Erstellen eines benutzerdefinierten d3-Layouts

Question

Ich muss ein benutzerdefiniertes d3-Layout erstellen, das in der Nähe einer Treemap liegt, jedoch in einem dreieckigen Stil. Hier ist ein Screenshot, so dass Sie verstehen können: Pyramid layout

Wie Sie sehen, es funktioniert recht ordentlich und passt mein Bedürfnis. es zu kodieren, habe ich den Code auf dem treemap Layout-Code basiert:

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

Mein Problem ist, dies zu tun, ich habe die d3.v2.js Datei musste direkt bearbeiten, weil einige private Funktionen nicht zugänglich sind von outisde, in meinem Fall d3_layout_hierarchyRebind. Offensichtlich weiß ich, es ist nicht die beste Praxis überhaupt, aber ich kann nicht meine Datei in einem separaten Skript externalize d3_layout_hierarchyRebindis von außen nicht sichtbar machen.

Ich weiß nicht, ob es ein d3- oder JavaScript-Problem ist, aber ich würde gerne wissen, ob Sie mir helfen könnten, dieses kleine Problem zu lösen.

Vielen Dank im Voraus!

Answer 1

Kopieren und fügen Sie einfach die Funktion d3.layout.pyramid in eine neue Datei ein und benennen Sie die Funktionen nach Bedarf um, damit sie nicht in Konflikt mit der Bibliothek d3 steht. Wahrscheinlich wird alles privat sein, so dass nur die äußerste Funktion umbenannt werden muss. Sie müssen es wahrscheinlich nicht mit "d3" benennen. Das heißt, das sollte funktionieren:

var myPyramidLayout = function() { 
    ... 
}