From 4acb7e9fb7973b4f903c135c8388335328d71811 Mon Sep 17 00:00:00 2001 From: oak-tree Date: Wed, 8 Jan 2014 21:04:52 +0200 Subject: [PATCH] set label of edge at the angle of this edge. moreover, if two vertices have more than 1 edge allow each edge to have its own label. make sure each labels does not interfere each other. --- springyui.js | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/springyui.js b/springyui.js index 2ae8d37..ab5127c 100755 --- a/springyui.js +++ b/springyui.js @@ -166,7 +166,8 @@ jQuery.fn.springy = function(params) { } } - var spacing = 6.0; + //change default to 10.0 to allow text fit between edges + var spacing = 10.0; //was 6.0 before // Figure out how far off center the line should be drawn var offset = normal.multiply(-((total - 1) * spacing)/2.0 + (n * spacing)); @@ -234,7 +235,11 @@ jQuery.fn.springy = function(params) { ctx.textBaseline = "top"; ctx.font = "10px Helvetica, sans-serif"; ctx.fillStyle = "#5BA6EC"; - ctx.fillText(text, (x1+x2)/2, (y1+y2)/2); + var xText = (s1.x+s2.x)/2; + var yText = (s1.y+s2.y)/2; + ctx.translate(xText, yText); + ctx.rotate(getTextAngle(s1.x,s1.y,s2.x,s2.y)); + ctx.fillText(text, 0,-2); ctx.restore(); } @@ -274,6 +279,12 @@ jQuery.fn.springy = function(params) { renderer.start(); + // return angle of text in radian + function getTextAngle(x1, y1, x2, y2){ + var tan = (y2-y1)/(x2-x1); + return Math.atan(tan); + } + // helpers for figuring out where to draw arrows function intersect_line_line(p1, p2, p3, p4) { var denom = ((p4.y - p3.y)*(p2.x - p1.x) - (p4.x - p3.x)*(p2.y - p1.y));