Skip to content

Instantly share code, notes, and snippets.

@alatzl

alatzl/_.md

Created June 23, 2015 16:30
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save alatzl/fa065de546d6df931b9c to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save alatzl/fa065de546d6df931b9c to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. alatzl revised this gist Jun 23, 2015. No changes.
  2. alatzl revised this gist Jun 23, 2015. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions _.md
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    [ <a href="http://tributary.io/inlet/fa065de546d6df931b9c">Launch: Three Circles Setup</a> ] fa065de546d6df931b9c by alatzl<br>[ <a href="http://tributary.io/inlet/c6a6d74703906368d8df">Launch: Three Circles Setup</a> ] c6a6d74703906368d8df by alatzl<br>[ <a href="http://tributary.io/inlet/6258892">Launch: Three Circles Answer</a> ] 6258892 by lewis500<br>[ <a href="http://tributary.io/inlet/5565405">Launch: Three Circles Answer</a> ] 5565405 by lewis500<br>
  3. alatzl created this gist Jun 23, 2015.
    1 change: 1 addition & 0 deletions config.json
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    {"description":"Three Circles Setup","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"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,"thumbnail":"http://i.imgur.com/DFgDX32.png","ajax-caching":true}
    34 changes: 34 additions & 0 deletions inlet.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,34 @@
    var svg = d3.select("svg");
    var data = [ 42, 13, 69 ];

    //make groups for each data point. put a circle in each group. add labels to each circle.
    var groups = svg.selectAll('g')
    .data(data)
    .enter()
    .append('g')
    .attr('transform', function(d, i) {
    var x = 50 + i*100;
    var y = 50 + i*100;
    return "translate(" + [x,y] + ")";
    });

    var circles = groups.append('circle')
    .attr({
    'cx': 0,
    'cy': 0,
    'r': 25,
    'fill': '#999',
    'stroke': '#111',
    'stroke-width': 2
    });

    var labels = groups.append('text')
    .text(function(d, i) {
    return d;
    })
    .attr({
    'text-anchor': 'middle',
    'alignment-baseline': 'middle'
    });

    circles.exit().remove();