Mind map

by ian_smithz

CSS

.node circle {
    fill: #fff;
    stroke: steelblue;
    stroke-width: 1.5px;
}
.node {
    font: 10px sans-serif;
}
.link {
    fill: none;
    stroke: #8686fa;
    stroke-width: 1.5px;
}

JavaScript

var width = 800,
    height = 600;

var cluster = d3.layout.cluster()
    .size([height, width - 160]);

var diagonal = d3.svg.diagonal()
    .projection(function (d) {
    return [d.y, d.x];
});

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height)
    .append("g")
    .attr("transform", "translate(40,0)");

    var root = getData(),
        nodes = cluster.nodes(root),
        links = cluster.links(nodes);

    var half1Xmin = 100000;
    var half1Xmax = 0;
    var half1delta = 0;
    var half2Xmin = 100000;
    var half2Xmax = 0;
    var half2delta = 0;
    var allXmin = 100000;
    var allXmax = 0;
    var alldelta = 0;
    var padding = 0;
    var Ymax = 0;
    var Yroot = 0;

    nodes.forEach(function(d) {
        var half = 1;
        var level = 1000;
        var curr = d;
        var depth = d.depth;
        if (depth > 0) {
            while(curr.depth > 1) {
                curr = curr.parent; 
            };
        };    
        if (Ymax < d.y)
            Ymax = d.y;   
        if (allXmin > d.x)
            allXmin = d.x;
        if (allXmax < d.x)
            allXmax = d.x;   
        if(curr.x < height/2) {
            if (half1Xmin > d.x)
                half1Xmin = d.x;
            if (half1Xmax < d.x)
                half1Xmax = d.x;   
        }
        else {
            if (half2Xmin > d.x)
                half2Xmin = d.x;
            if (half2Xmax < d.x)
                half2Xmax = d.x;   
            //d.x += 100;
        };
    });

    half1delta = half1Xmax - half1Xmin;
    half2delta = half2Xmax - half2Xmin;
    alldelta = allXmax - allXmin;
    padding = (height - alldelta)/2;

    nodes.forEach(function(d) {
        var half = 1;
        var level = 1000;
        var curr = d;
        var depth = d.depth;
        if(depth < 2) {
            return;
        }   
        if (depth > 0) {
            while(curr.depth > 1) {
                curr = curr.parent; 
            };
        };
     ...