Tributary inlet

_.md

[ Launch: Tributary inlet ] 6236061 by msurguy
No parent Inlet

config.json

{"editor_editor":{"coffee":false,"vim":false,"emacs":false,"width":571,"height":574,"hide":false},"description":"Tributary inlet","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"inlet.svg":{"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/NyIN5DA.png"}

inlet.js

var svg = d3.select("svg");


var data = [ 42, 13, 69 ];


var groups = svg.selectAll("g")
    .data(data)
    .enter()
    .append("g");

groups.attr("transform", function(d,i) {
  var x = 78 * i + 100;
  var y = 41 * i + 100;
  return "translate(" + [ x, y] + ")";
})

var circles = groups.append("circle")
    .attr({
      cx: function(d,i) {
        return 0;
        //return i * 40 + 172;
      },
      cy: function(d,i) {
        return 0;
        //return i * 30 + 160;
      },
      r: 20,
      fill: "#BDBABA",
      stroke: "#000000",
      "stroke-width": 3
    })
    
var label = groups.append("text")
    .text(function(d) {
      return d;
    })
    .attr({
      "alignment-baseline": "middle",
      "text-anchor": "middle"
    })
    
    
    
    

inlet.svg

<svg class="tributary_svg" width="1308" height="703"><g transform="translate(100,100)"><circle cx="0" cy="0" r="20" fill="#BDBABA" stroke="#000000" stroke-width="3"></circle><text alignment-baseline="middle" text-anchor="middle">42</text></g><g transform="translate(178,141)"><circle cx="0" cy="0" r="20" fill="#BDBABA" stroke="#000000" stroke-width="3"></circle><text alignment-baseline="middle" text-anchor="middle">13</text></g><g transform="translate(256,182)"><circle cx="0" cy="0" r="20" fill="#BDBABA" stroke="#000000" stroke-width="3"></circle><text alignment-baseline="middle" text-anchor="middle">69</text></g></svg>