fix(edges): correctly detect self ref edge hover (#399)

visjs · Jan 28, 2020 · 2abf6f4 · 2abf6f4
1 parent 0d98fb9
commit 2abf6f4
Show file tree

Hide file tree

Showing 9 changed files with 34 additions and 11 deletions.
diff --git a/examples/network/edgeStyles/selfReference.html b/examples/network/edgeStyles/selfReference.html
@@ -77,7 +77,7 @@
                 from: 2, to: 2, label: "Testing", arrows: 'to, middle, from',
                 selfReference: {
                     size: 40,
-                    angle: Math.PI / 6,
+                    angle: Math.PI * 7 / 6,
                     renderBehindTheNode: false
                 }
             },
@@ -98,7 +98,18 @@
             edges: edges
         };
         var options = {
-
+            edges: {
+                color: {
+                    color: "#2B7CE9",
+                    highlight: "#2B7CE9",
+                    hover: "#2B7CE9"
+                },
+                hoverWidth: function (width) { return width + 2; },
+                shadow: true
+            },
+            interaction: {
+                hover: true,
+            },
         };
         var network = new vis.Network(container, data, options);
 

diff --git a/lib/network/modules/components/nodes/shapes/Box.js b/lib/network/modules/components/nodes/shapes/Box.js
@@ -80,7 +80,9 @@ class Box extends NodeBase {
    * @returns {number}
    */
   distanceToBorder(ctx, angle) {
-    this.resize(ctx);
+    if (ctx) {
+      this.resize(ctx);
+    }
     let borderWidth = this.options.borderWidth;
 
     return Math.min(

diff --git a/lib/network/modules/components/nodes/shapes/Circle.js b/lib/network/modules/components/nodes/shapes/Circle.js
@@ -78,7 +78,9 @@ class Circle extends CircleImageBase {
    * @returns {number}
    */
   distanceToBorder(ctx, angle) {  // eslint-disable-line no-unused-vars
-    this.resize(ctx);
+    if (ctx) {
+      this.resize(ctx);
+    }
     return this.width * 0.5;
   }
 }

diff --git a/lib/network/modules/components/nodes/shapes/CircularImage.js b/lib/network/modules/components/nodes/shapes/CircularImage.js
@@ -104,7 +104,9 @@ class CircularImage extends CircleImageBase {
    * @returns {number}
    */
   distanceToBorder(ctx, angle) {  // eslint-disable-line no-unused-vars
-    this.resize(ctx);
+    if (ctx) {
+      this.resize(ctx);
+    }
     return this.width * 0.5;
   }
 }

diff --git a/lib/network/modules/components/nodes/shapes/Dot.js b/lib/network/modules/components/nodes/shapes/Dot.js
@@ -37,7 +37,9 @@ class Dot extends ShapeBase {
    * @returns {number}
    */
   distanceToBorder(ctx, angle) {  // eslint-disable-line no-unused-vars
-    this.resize(ctx);
+    if (ctx) {
+      this.resize(ctx);
+    }
     return this.options.size;
   }
 }

diff --git a/lib/network/modules/components/nodes/shapes/Ellipse.js b/lib/network/modules/components/nodes/shapes/Ellipse.js
@@ -63,7 +63,9 @@ class Ellipse extends NodeBase {
    * @returns {number}
    */
   distanceToBorder(ctx, angle) {
-    this.resize(ctx);
+    if (ctx) {
+      this.resize(ctx);
+    }
     var a = this.width * 0.5;
     var b = this.height * 0.5;
     var w = (Math.sin(angle) * a);

diff --git a/lib/network/modules/components/nodes/util/NodeBase.js b/lib/network/modules/components/nodes/util/NodeBase.js
@@ -61,7 +61,9 @@ class NodeBase {
    */
   _distanceToBorder(ctx,angle) {
     var borderWidth = this.options.borderWidth;
-    this.resize(ctx);
+    if (ctx){
+      this.resize(ctx);
+    }
     return Math.min(
         Math.abs(this.width / 2 / Math.cos(angle)),
         Math.abs(this.height / 2 / Math.sin(angle))) + borderWidth;

diff --git a/lib/network/modules/components/shared/ComponentUtil.js b/lib/network/modules/components/shared/ComponentUtil.js
@@ -128,7 +128,7 @@ class ComponentUtil {
     let x = node.x;
     let y = node.y;
 
-    if(ctx && typeof node.distanceToBorder === "function"){
+    if(typeof node.distanceToBorder === "function"){
         //calculating opposite and adjacent
         //distaneToBorder becomes Hypotenuse. 
         //Formulas sin(a) = Opposite / Hypotenuse and cos(a) = Adjacent / Hypotenuse

diff --git a/test/edges/bezier-edge-dynamic.test.ts b/test/edges/bezier-edge-dynamic.test.ts
@@ -250,8 +250,8 @@ describe('BezierEdgeDynamic', function(): void {
       )
 
       expect(edge.getPoint(0.5)).to.deep.equal({
-        x: 421,
-        y: -404,
+        x: 400,
+        y: -846,
       })
     })
   })
-Original file line number
+Diff line change
@@ Expand Up / @@ -250,8 +250,8 @@ describe('BezierEdgeDynamic', function(): void { @@
           )
           expect(edge.getPoint(0.5)).to.deep.equal({
-            x: 421,
-            y: -404,
+            x: 400,
+            y: -846,
           })
         })
       })
@@ Expand Down @@