Skip to content

Instantly share code, notes, and snippets.

@ninestar09
Created February 25, 2016 00:46
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ninestar09/f076593e473b65778850 to your computer and use it in GitHub Desktop.
Save ninestar09/f076593e473b65778850 to your computer and use it in GitHub Desktop.
path_first
{"description":"path_first","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}
var svg = d3.select("svg");
var data = [{x:0, y:8},
{x:10, y:22},
{x:20, y:20},
{x:30, y:80},
{x:40, y:34},
{x:50, y:54},
{x:60, y:54},
{x:70, y:9},
{x:80, y:128},
{x:90, y:12}
];
var line = d3.svg.line()
.x(function(d) {
return d.x;
})
.y(function(d) {
return d.y;
});
var tx=150;
var ty=250;
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: "#0a0a0a"
})
var text = group.append("text")
.attr("transform","translate("+[-1,-13]+")")
.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))
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment