Tributary inlet

_.md

[ Launch: Tributary inlet ] 5811382 by joannecheng
[ Launch: Tributary inlet ] 5811335 by brjadams

config.json

{"description":"Tributary inlet","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"sample.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":true,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01}

inlet.js

var width = 380,
    height = 140,
    radius = Math.min(width, height) / 2;

var color = d3.scale.ordinal()
    .range(["#EC0690", "#666769", "#00ACF5"]);

var arc = d3.svg.arc()
    .outerRadius(radius - 10)
    .innerRadius(0);

var pie = d3.layout.pie()
    .sort(null)
    .value(function(d) { return d.population; });

var svg = d3.select("svg").append("svg")
    .attr("width", width)
    .attr("height", height)
  .append("g")
    .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");

    d3.json("sample.js", function(json) {
      dthree = json;
      var g = svg.selectAll(".arc")
        .data(pie(sr.getVisitsData(dthree.totalVisits)))
      .enter().append("g")
        .attr("class", "arc");

    g.append("path")
        .attr("d", arc)
        .style("fill", function(d) { return color(d.data.age); });

    g.append("text")
        .attr("transform", function(d) { return "translate(" + arc.centroid(d) + ")"; })
        .attr("dy", ".35em")
        .style("text-anchor", "middle")
        .text(function(d) { return d.data.age; });
    });

sample.js

{
  "totalVisits": 
  {
    "US": 4564,
    "Can/Uk/Aus": 1234,
    "International": 564
  },
  "totalImpressions": 
  {
    "impressions": 435987,
    "reach": 40000,
    "retweets": 234,
    "favorites": 20,
    "comments": 1
  },
  "campaignProgress":
  {
    "actual": 2300,
    "goal": 5000
  },
  "visitsOverTime": 
  [
    {
      "date": "2013-06-01",
      "visits": 5
    },
    {
      "date": "2013-06-02",
      "visits": 10
    },
    {
      "date": "2013-06-03",
      "visits": 12
    },
    {
      "date": "2013-06-04",
      "visits": 8
    },
    {
      "date": "2013-06-05",
      "visits": 3
    }
  ]
}