Added auto text orientation for edge labels
Added new boolean option edgeLabelsUpright which makes edge labels automatically flip over the edge when they are upside-down. Addresses readability aspect of #56.
This commit is contained in:
parent
9eb89a03cf
commit
6cb2dd813f
11
springyui.js
11
springyui.js
|
@ -34,6 +34,7 @@ jQuery.fn.springy = function(params) {
|
||||||
var damping = params.damping || 0.5;
|
var damping = params.damping || 0.5;
|
||||||
var nodeSelected = params.nodeSelected || null;
|
var nodeSelected = params.nodeSelected || null;
|
||||||
var nodeImages = {};
|
var nodeImages = {};
|
||||||
|
var edgeLabelsUpright = true;
|
||||||
|
|
||||||
var canvas = this[0];
|
var canvas = this[0];
|
||||||
var ctx = canvas.getContext("2d");
|
var ctx = canvas.getContext("2d");
|
||||||
|
@ -276,9 +277,15 @@ jQuery.fn.springy = function(params) {
|
||||||
ctx.textBaseline = "top";
|
ctx.textBaseline = "top";
|
||||||
ctx.font = (edge.data.font !== undefined) ? edge.data.font : edgeFont;
|
ctx.font = (edge.data.font !== undefined) ? edge.data.font : edgeFont;
|
||||||
ctx.fillStyle = stroke;
|
ctx.fillStyle = stroke;
|
||||||
var textPos = s1.add(s2).divide(2).add(normal.multiply(-8));
|
var angle = Math.atan2(s2.y - s1.y, s2.x - s1.x);
|
||||||
|
var displacement = -8;
|
||||||
|
if (edgeLabelsUpright && (angle > Math.PI/2 || angle < -Math.PI/2)) {
|
||||||
|
displacement = 8;
|
||||||
|
angle += Math.PI;
|
||||||
|
}
|
||||||
|
var textPos = s1.add(s2).divide(2).add(normal.multiply(displacement));
|
||||||
ctx.translate(textPos.x, textPos.y);
|
ctx.translate(textPos.x, textPos.y);
|
||||||
ctx.rotate(Math.atan2(s2.y - s1.y, s2.x - s1.x));
|
ctx.rotate(angle);
|
||||||
ctx.fillText(text, 0,-2);
|
ctx.fillText(text, 0,-2);
|
||||||
ctx.restore();
|
ctx.restore();
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user