Skip to content

Instantly share code, notes, and snippets.

@samzhang111 samzhang111/_.md
Created Apr 8, 2014

Embed
What would you like to do?
arcs
{"description":"arcs","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,"ajax-caching":true,"thumbnail":"http://i.imgur.com/1GyRVK4.png"}
// DATA --> these can be tweaked for fun
p1 = {
x: 200,
y: 300
};
p2 = {
x: 600,
y: 100
};
conflict_index = 5;
// functions
function get_scale(p1, p2) {
var dist = Math.sqrt((p1.x-p2.x)*(p1.x-p2.x)+(p1.y-p2.y)*(p1.y-p2.y))/1.5;
return d3.scale.linear().domain([-10, 10]).range([-1*dist, dist]);
}
function draw_arc(p1, p2, weight) {
var slope = (p1.y-p2.y)/(p1.x-p2.x);
var m = {
x: (p1.x+p2.x)/2+weight*-slope,
y: (p1.y + p2.y)/2+weight
}
//var str = "M p1.x p1.y Q m.x m.y p2.x p2.y";
return "M " + p1.x + " " + p1.y + " Q " + m.x + " " + m.y + " " + p2.x + " " + p2.y;
}
// code
var scale = get_scale(p1, p2);
var weight = scale(conflict_index);
var pathstr = draw_arc(p1, p2, weight);
var svg = d3.select("svg");
var arc = svg.append("path")
.attr("d", pathstr)
.attr("stroke", "black")
.attr("fill", "none")
.attr("stroke-width", 4.48);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.