Tributary inlet

_.md

[ Launch: Tributary inlet ] 5bf22058ce477084bbf7 by emunsing

config.json

{"description":"Tributary inlet","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"pingpong","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"ajax-caching":true}

inlet.js

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

var cx = tributary.sw/2;
var cy = tributary.sh/2;
var outr = 200;

var outer = mySvg.append("circle")
.attr({
  cx: cx,
  cy: cy,
  r : outr,
  fill:"none",
  stroke:"#03c100",
  "stroke-width": 4
});

var electron = mySvg.append("circle")
.attr({
  cx: cx+outr,
  cy: cy,
  r: 15,
  fill: "#000000"
})

var myCoords = mySvg.append("text")
	.attr("transform","translate("+[0,20]+")")
	.text("Hello World!");

var myDrag = d3.behavior.drag()
.on("drag",function(){
	var mx = d3.mouse(this)[0];
	var my = d3.mouse(this)[1];
  var omega = Math.atan2(mx-cx,my-cy);
  myCoords.text("Woot!");
  var nx = outr.Math.sin(omega);
  var ny = outr.Math.cos(omega);
  electron.attr({cx: cx+ nx, cy:cy + ny});
})

electron.call(myDrag);