Browse Source

added edge selection on edge label

v3_develop
Alex de Mulder 9 years ago
parent
commit
613c1e398a
3 changed files with 2014 additions and 1981 deletions
  1. +1
    -0
      HISTORY.md
  2. +1985
    -1969
      dist/vis.js
  3. +28
    -12
      lib/network/Edge.js

+ 1
- 0
HISTORY.md View File

@ -8,6 +8,7 @@ http://visjs.org
- Fixed nodes not always being unfixed when using allowedToMove.
- Added dragStart and dragEnd events.
- Added edge selection on edge labels.
### Graph2d

+ 1985
- 1969
dist/vis.js
File diff suppressed because it is too large
View File


+ 28
- 12
lib/network/Edge.js View File

@ -38,6 +38,7 @@ function Edge (properties, network, networkConstants) {
this.value = undefined;
this.selected = false;
this.hover = false;
this.labelDimensions = {top:0,left:0,width:0,height:0};
this.from = null; // a node
this.to = null; // a node
@ -547,22 +548,26 @@ Edge.prototype._label = function (ctx, text, x, y) {
// TODO: cache the calculated size
ctx.font = ((this.from.selected || this.to.selected) ? "bold " : "") +
this.options.fontSize + "px " + this.options.fontFace;
ctx.fillStyle = this.options.fontFill;
var lines = String(text).split('\n');
var lineCount = lines.length;
var fontSize = (Number(this.options.fontSize) + 4);
var yLine = y + (1 - lineCount) / 2 * fontSize;
var width = ctx.measureText(lines[0]).width;
for (var i = 1; i < lineCount; i++) {
var lineWidth = ctx.measureText(lines[i]).width;
width = lineWidth > width ? lineWidth : width;
}
var height = this.options.fontSize * lineCount;
var left = x - width / 2;
var top = y - height / 2;
this.labelDimensions = {top:top,left:left,width:width,height:height};
if (this.options.fontFill !== undefined && this.options.fontFill !== null && this.options.fontFill !== "none") {
var width = ctx.measureText(lines[0]).width;
for (var i = 1; i < lineCount; i++) {
var lineWidth = ctx.measureText(lines[i]).width;
width = lineWidth > width ? lineWidth : width;
}
var height = this.options.fontSize * lineCount;
var left = x - width / 2;
var top = y - height / 2;
ctx.fillStyle = this.options.fontFill;
ctx.fillRect(left, top, width, height);
}
@ -918,6 +923,7 @@ Edge.prototype._drawArrow = function(ctx) {
* @private
*/
Edge.prototype._getDistanceToEdge = function (x1,y1, x2,y2, x3,y3) { // x3,y3 is the point
var returnValue = 0;
if (this.from != this.to) {
if (this.options.smoothCurves.enabled == true) {
var xVia, yVia;
@ -943,10 +949,10 @@ Edge.prototype._getDistanceToEdge = function (x1,y1, x2,y2, x3,y3) { // x3,y3 is
}
lastX = x; lastY = y;
}
return minDistance
returnValue = minDistance;
}
else {
return this._getDistanceToLine(x1,y1,x2,y2,x3,y3);
returnValue = this._getDistanceToLine(x1,y1,x2,y2,x3,y3);
}
}
else {
@ -963,7 +969,17 @@ Edge.prototype._getDistanceToEdge = function (x1,y1, x2,y2, x3,y3) { // x3,y3 is
}
dx = x - x3;
dy = y - y3;
return Math.abs(Math.sqrt(dx*dx + dy*dy) - radius);
returnValue = Math.abs(Math.sqrt(dx*dx + dy*dy) - radius);
}
if (this.labelDimensions.left < x3 &&
this.labelDimensions.left + this.labelDimensions.width > x3 &&
this.labelDimensions.top < y3 &&
this.labelDimensions.top + this.labelDimensions.height > y3) {
return 0;
}
else {
return returnValue;
}
};

Loading…
Cancel
Save