Selection + transition example

_.md

[ Launch: test ] bdc5817c2e0c8dabb773 by joannecheng

config.json

{"description":"Selection + transition example","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}},"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,"tab":"edit","display_percent":0.7,"thumbnail":"http://i.imgur.com/Z4ghHZY.png","fullscreen":false,"ajax-caching":true}

inlet.js

var svg = d3.select("svg")
if (d3.select(".mouse")[0][0] == null) {
  console.log("draw")
	var div = d3.select("svg")
		.append("rect")
    	.attr({
      		height: 100,
      		width: 100,
      		x: 0,
      		y:0
    	})
		.classed("mouse", true)
}

svg.append("line")
.attr({
  x1: 200,
  y1: 62,
  x2: 150,
  y2: 190,
  stroke: "#3BA360",
  class: "line1"
});


d3.select(".mouse")
	.on("mouseover", function() {
 	var line = svg.select(".line1");
    var xpos = line.attr("x1");
    line.attr("x1", parseFloat(xpos) + 5)
})