Skip to content

Instantly share code, notes, and snippets.

@rvenugopal
Created October 19, 2012 15:41
Show Gist options
  • Select an option

  • Save rvenugopal/3918930 to your computer and use it in GitHub Desktop.

Select an option

Save rvenugopal/3918930 to your computer and use it in GitHub Desktop.

Revisions

  1. rvenugopal revised this gist Oct 20, 2012. 1 changed file with 48 additions and 1 deletion.
    49 changes: 48 additions & 1 deletion inlet.js
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,50 @@
    var myData = {
    text : 'Asia trip',
    c2p : null,
    level : 1,
    children : [
    {
    text : 'Taiwan',
    c2p : 'Gotta have a good time',
    level : 2,
    children : [
    {
    text : 'Taipei',
    c2p : 'City living',
    level : 3,

    },
    {
    text : 'Taroka gorge',
    c2p : 'Nice views',
    level : 3,
    }]
    },
    {
    text : 'Thailand',
    c2p : 'Sunny beaches',
    level : 2,
    children : [
    {
    text : 'Bangkok',
    c2p : 'City Center',
    level : 3,

    },
    {
    text : 'Chiang Mai',
    c2p : 'Nice treks',
    level : 3,
    }]
    },
    {
    text : 'India',
    c2p : 'Historical',
    level : 2,
    }
    ]
    }

    console.log(myData);

    var width = 960,
    @@ -7,7 +54,7 @@ var width = 960,
    var tree = d3.layout.tree()
    .size([height, width - 160])
    .separation(function(a, b) {
    return (a.parent == b.parent ? 1 : 2) / a.depth;
    return (a.chidlren == b.children ? 1 : 2) / a.depth;
    });

    var diagonal = d3.svg.diagonal.radial()
  2. rvenugopal revised this gist Oct 20, 2012. 1 changed file with 2 additions and 0 deletions.
    2 changes: 2 additions & 0 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,5 @@
    console.log(myData);

    var width = 960,
    height = 2200,
    radius = 400;
  3. rvenugopal revised this gist Oct 20, 2012. 1 changed file with 0 additions and 18 deletions.
    18 changes: 0 additions & 18 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,3 @@
    var svg = d3.select("svg");

    var width = 960,
    height = 2200,
    radius = 400;
    @@ -22,22 +20,6 @@ var vis = d3.select("#display").append("svg")
    .append("g")
    .attr("transform", "translate(" + radius + "," + radius + ")");

    var link = vis.selectAll("path.link")
    .data(tree.links(nodes))
    .enter().append("path")
    .attr("class", "link")
    .attr("d", diagonal);

    var node = vis.selectAll("g.node")
    .data(nodes)
    .enter().append("g")
    .attr("class", "node")
    .attr("transform", function(d) {
    return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")";
    })

    node.append("circle")
    .attr("r", 4.5);



  4. rvenugopal revised this gist Oct 20, 2012. 1 changed file with 7 additions and 2 deletions.
    9 changes: 7 additions & 2 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -16,7 +16,7 @@ var diagonal = d3.svg.diagonal.radial()
    return [d.y, d.x / 180 * Math.PI];
    });

    var vis = d3.select("#chart").append("svg")
    var vis = d3.select("#display").append("svg")
    .attr("width", width)
    .attr("height", height)
    .append("g")
    @@ -32,7 +32,12 @@ var link = vis.selectAll("path.link")
    .data(nodes)
    .enter().append("g")
    .attr("class", "node")
    .attr("transform", function(d) { return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")"; })
    .attr("transform", function(d) {
    return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")";
    })

    node.append("circle")
    .attr("r", 4.5);



  5. rvenugopal revised this gist Oct 19, 2012. 1 changed file with 19 additions and 2 deletions.
    21 changes: 19 additions & 2 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,8 @@
    var svg = d3.select("svg");

    var width = 960,
    height = 2200,
    radius = 500;
    radius = 400;

    var tree = d3.layout.tree()
    .size([height, width - 160])
    @@ -18,7 +20,22 @@ var vis = d3.select("#chart").append("svg")
    .attr("width", width)
    .attr("height", height)
    .append("g")
    .attr("transform", "translate(40, 0)");
    .attr("transform", "translate(" + radius + "," + radius + ")");

    var link = vis.selectAll("path.link")
    .data(tree.links(nodes))
    .enter().append("path")
    .attr("class", "link")
    .attr("d", diagonal);

    var node = vis.selectAll("g.node")
    .data(nodes)
    .enter().append("g")
    .attr("class", "node")
    .attr("transform", function(d) { return "rotate(" + (d.x - 90) + ")translate(" + d.y + ")"; })






  6. rvenugopal revised this gist Oct 19, 2012. 1 changed file with 5 additions and 1 deletion.
    6 changes: 5 additions & 1 deletion inlet.js
    Original file line number Diff line number Diff line change
    @@ -14,7 +14,11 @@ var diagonal = d3.svg.diagonal.radial()
    return [d.y, d.x / 180 * Math.PI];
    });


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



  7. rvenugopal revised this gist Oct 19, 2012. 2 changed files with 18 additions and 16 deletions.
    2 changes: 1 addition & 1 deletion config.json
    Original file line number Diff line number Diff line change
    @@ -1 +1 @@
    {"endpoint":"","display":"svg","public":true,"require":[],"tab":"edit","display_percent":0.7,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01}
    {"endpoint":"","display":"svg","public":true,"require":[],"tab":"edit","display_percent":0.5195376584638328,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01}
    32 changes: 17 additions & 15 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -1,18 +1,20 @@
    var svg = d3.select("svg");
    var width = 960,
    height = 2200,
    radius = 500;

    var tree = d3.layout.tree()
    .size([height, width - 160])
    .separation(function(a, b) {
    return (a.parent == b.parent ? 1 : 2) / a.depth;
    });

    var diagonal = d3.svg.diagonal.radial()
    .projection(function(d)
    {
    return [d.y, d.x / 180 * Math.PI];
    });



    svg.append("rect")
    .attr({
    x : 100, y :100,
    width: 50, height: 35,
    fill : "#A39381"
    });


    svg.append("circle")
    .attr({cx : 300, cy : 400, r: 100,
    fill : "red"
    })




  8. rvenugopal revised this gist Oct 19, 2012. 2 changed files with 46 additions and 49 deletions.
    46 changes: 46 additions & 0 deletions dataTree.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,46 @@
    var myData = {
    text : 'Asia trip',
    c2p : null,
    level : 1,
    children : [
    {
    text : 'Taiwan',
    c2p : 'Gotta have a good time',
    level : 2,
    children : [
    {
    text : 'Taipei',
    c2p : 'City living',
    level : 3,

    },
    {
    text : 'Taroka gorge',
    c2p : 'Nice views',
    level : 3,
    }]
    },
    {
    text : 'Thailand',
    c2p : 'Sunny beaches',
    level : 2,
    children : [
    {
    text : 'Bangkok',
    c2p : 'City Center',
    level : 3,

    },
    {
    text : 'Chiang Mai',
    c2p : 'Nice treks',
    level : 3,
    }]
    },
    {
    text : 'India',
    c2p : 'Historical',
    level : 2,
    }
    ]
    }
    49 changes: 0 additions & 49 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -1,54 +1,5 @@
    var svg = d3.select("svg");

    var myData = {
    text : 'Asia trip',
    c2p : null,
    level : 1,
    children : [
    {
    text : 'Taiwan',
    c2p : 'Gotta have a good time',
    level : 2,
    children : [
    {
    text : 'Taipei',
    c2p : 'City living',
    level : 3,

    },
    {
    text : 'Taroka gorge',
    c2p : 'Nice views',
    level : 3,
    }]
    },
    {
    text : 'Thailand',
    c2p : 'Sunny beaches',
    level : 2,
    children : [
    {
    text : 'Bangkok',
    c2p : 'City Center',
    level : 3,

    },
    {
    text : 'Chiang Mai',
    c2p : 'Nice treks',
    level : 3,
    }]
    },
    {
    text : 'India',
    c2p : 'Historical',
    level : 2,
    }
    ],


    }

    svg.append("rect")
    .attr({
    x : 100, y :100,
  9. rvenugopal revised this gist Oct 19, 2012. 1 changed file with 2 additions and 0 deletions.
    2 changes: 2 additions & 0 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -61,5 +61,7 @@ svg.append("circle")
    .attr({cx : 300, cy : 400, r: 100,
    fill : "red"
    })




  10. rvenugopal revised this gist Oct 19, 2012. 1 changed file with 21 additions and 2 deletions.
    23 changes: 21 additions & 2 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -11,15 +11,34 @@ var myData = {
    level : 2,
    children : [
    {

    text : 'Taipei',
    c2p : 'City living',
    level : 3,

    },
    {
    text : 'Taroka gorge',
    c2p : 'Nice views',
    level : 3,
    }]
    },
    {
    text : 'Thailand',
    c2p : 'Sunny beaches',
    level : 2,
    },
    children : [
    {
    text : 'Bangkok',
    c2p : 'City Center',
    level : 3,

    },
    {
    text : 'Chiang Mai',
    c2p : 'Nice treks',
    level : 3,
    }]
    },
    {
    text : 'India',
    c2p : 'Historical',
  11. rvenugopal revised this gist Oct 19, 2012. 1 changed file with 30 additions and 0 deletions.
    30 changes: 30 additions & 0 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,35 @@
    var svg = d3.select("svg");

    var myData = {
    text : 'Asia trip',
    c2p : null,
    level : 1,
    children : [
    {
    text : 'Taiwan',
    c2p : 'Gotta have a good time',
    level : 2,
    children : [
    {


    }]
    },
    {
    text : 'Thailand',
    c2p : 'Sunny beaches',
    level : 2,
    },
    {
    text : 'India',
    c2p : 'Historical',
    level : 2,
    }
    ],


    }

    svg.append("rect")
    .attr({
    x : 100, y :100,
  12. rvenugopal revised this gist Oct 19, 2012. 1 changed file with 5 additions and 5 deletions.
    10 changes: 5 additions & 5 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -5,12 +5,12 @@ svg.append("rect")
    x : 100, y :100,
    width: 50, height: 35,
    fill : "#A39381"
    })
    });


    svg.append("circle")
    .attr({


    .attr({cx : 300, cy : 400, r: 100,
    fill : "red"
    })



  13. rvenugopal revised this gist Oct 19, 2012. No changes.
  14. rvenugopal revised this gist Oct 19, 2012. 1 changed file with 8 additions and 1 deletion.
    9 changes: 8 additions & 1 deletion inlet.js
    Original file line number Diff line number Diff line change
    @@ -2,8 +2,15 @@ var svg = d3.select("svg");

    svg.append("rect")
    .attr({
    x(100), y(100)
    x : 100, y :100,
    width: 50, height: 35,
    fill : "#A39381"
    })


    svg.append("circle")
    .attr({


    })

  15. rvenugopal revised this gist Oct 19, 2012. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions _.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    [ <a href="http://enjalot.com/tributary/3918930">Launch Inlet</a> ]
  16. rvenugopal created this gist Oct 19, 2012.
    1 change: 1 addition & 0 deletions config.json
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    {"endpoint":"","display":"svg","public":true,"require":[],"tab":"edit","display_percent":0.7,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01}
    9 changes: 9 additions & 0 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,9 @@
    var svg = d3.select("svg");

    svg.append("rect")
    .attr({
    x(100), y(100)
    })