click_paths

_.md

[ Launch: click_paths ] 7002879 by jshumakerpruitt

config.json

{"description":"click_paths","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":"pingpong","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"thumbnail":"http://i.imgur.com/NXXJFnW.png"}

inlet.js

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

var tx = 100;
var ty = 150;

var data = [
  {x: 1, y: 8}
  
  ];

var line = d3.svg.line()
.x(function(d) {
  return d.x;
})
.y(function(d) {
  return d.y;
});

var group = svg.append("g")
.attr("transform", "translate(" + [tx, ty] + ")");

var path = group.selectAll("path")
.data([data])
.enter()
.append("path")
.attr({
  d: line,
  fill: "none",
  stroke: "#000000"
});

var text = group.append("text")
	.text(line(data));

svg.on("click", function() {
  var p = d3.mouse(this);
  data.push({x: p[0] - tx, y: p[1] - ty});
  path.attr("d", line)
  text.text(line(data))});