settings allow rendering straight lines

settings_explorerjs.js

@@ -105,11 +105,11 @@ var showLabelsIfZoom=1.0;
 TW.edgeDefaultOpacity = 0.5  // opacity when true_color
 TW.edgeGreyColor = "rgba(150, 150, 150, 0.2)";
 TW.nodesGreyBorderColor = "rgba(100, 100, 100, 0.5)";
-
 TW.selectedColor = "node"  // "node" for a background like the node's color,
                               // "default" for note-like yellow
 
 TW.overSampling = true     // costly hi-def rendering (true => pixelRatio x 2)
+
 // ============ < / DEVELOPER OPTIONS > ============
 
 
@@ -121,7 +121,7 @@ var sigmaJsDrawingProperties = {
     labelSizeRatio: 2,   // ...but this ratio allows truly adjusting the sizes
 
     labelThreshold: 5,
-    defaultEdgeType: 'curve',
+    defaultEdgeType: 'curve',  // 'curve' or 'line'
 
     defaultBorderView: "always",
 
@@ -144,8 +144,8 @@ var sigmaJsDrawingProperties = {
     // fontStyle: "bold",
 };
 var sigmaJsGraphProperties = {
-    minEdgeSize: 1,
-    maxEdgeSize: 5
+    minEdgeSize: 2,
+    maxEdgeSize: 4
 };
 var sigmaJsMouseProperties = {
     minRatio: 0.1,

tinawebJS/main.js

@@ -269,6 +269,7 @@ if(RES["OK"]) {
 
     // custom edges rendering registered under 'curve'
     sigma.canvas.edges.curve = sigma_utils.twRender.canvas.edges.curve
+    sigma.canvas.edges.line = sigma_utils.twRender.canvas.edges.line
 
     // custom labels rendering
     //  - based on the normal one sigma.canvas.labels.def

tinawebJS/sigma.parseCustom.js

@@ -347,7 +347,6 @@ function dictfyGexf( gexf , categories ){
         // TW.partialGraph._core.graph.nodesIndex[it].size=Nodes[it].size;
     }
 
-
     var edgeId = 0;
     var edgesNodes = gexf.getElementsByTagName('edges');
     for(i=0; i<edgesNodes.length; i++) {
@@ -365,7 +364,7 @@ function dictfyGexf( gexf , categories ){
                 id: indice,
                 source: source,
                 target: target,
-                type : (type) ? type : "curve",
+                type : (type) ? type : sigmaJsDrawingProperties['defaultEdgeType'],
                 label: "",
                 categ: "",
                 attributes: []

tinawebJS/sigmaUtils.js

@@ -250,11 +250,60 @@ SigmaUtils = function () {
         source[prefix + 'x'],
         source[prefix + 'y']
       );
+
+      // NB a little too slow
+      var sx = source[prefix + 'x']
+      var sy = source[prefix + 'y']
+      var tx = target[prefix + 'x']
+      var ty = target[prefix + 'y']
       context.quadraticCurveTo(
-        (source[prefix + 'x'] + target[prefix + 'x']) / 2 +
-          (target[prefix + 'y'] - source[prefix + 'y']) / 4,
-        (source[prefix + 'y'] + target[prefix + 'y']) / 2 +
-          (source[prefix + 'x'] - target[prefix + 'x']) / 4,
+        (sx + tx) / 2 +
+          (ty - sy) / 4,
+        (sy + ty) / 2 +
+          (sx - tx) / 4,
+        tx,
+        ty
+      );
+      context.stroke();
+    };
+
+
+    this.twRender.canvas.edges.line = function(edge, source, target, context, settings) {
+      var color, size,
+        prefix = settings('prefix') || ''
+
+
+      //debug
+      // console.warn("rendering edge", edge)
+
+      var rgb = edge.customAttrs.rgb
+      var defSize = edge[prefix + 'size'] || 1
+      if (edge.customAttrs.activeEdge) {
+        size = defSize * 1.5
+        // color with less opacity
+        // cf. sigmaTools.edgeColor
+        color = 'rgba('+rgb.join()+',.7)'
+      }
+      else if (edge.customAttrs.grey) {
+        color = TW.edgeGreyColor
+        size = 1
+      }
+      else {
+        // color = "rgba( "+rgb.join()+" , "+TW.edgeDefaultOpacity+")";
+        color = edge.customAttrs.true_color
+        size = defSize
+      }
+
+      context.strokeStyle = color;
+      context.lineWidth = size ;
+
+
+      context.beginPath();
+      context.moveTo(
+        source[prefix + 'x'],
+        source[prefix + 'y']
+      );
+      context.lineTo(
         target[prefix + 'x'],
         target[prefix + 'y']
       );