title: Sigma curve and curvedArrow edge type renders as a line
body: <p>I am messing around with Sigma and I cannot seem to get the lines to curve. Regular arrows work ok, but curved do not.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var graphData = {
    "nodes": [
      { "id": "n0", "label": "A node", "x": 0, "y": 0, "size": 3 },
      { "id": "n1", "label": "Another node", "x": 3, "y": 1, "size": 2 },
      { "id": "n2", "label": "And a last one", "x": 1, "y": 3, "size": 1 },
  
      { "id": "n3", "label": "A node", "x": 2, "y": 0, "size": 8, "color": "#48ec51" },
      { "id": "n4", "label": "Another node", "x": 0, "y": 2, "size": 5, "color": "#5148ec" },
      { "id": "n5", "label": "And a last one", "x": 2, "y": 3, "size": 3, "color": "#ec48ec" }
    ],
    "edges": [
      { "id": "e0", "source": "n0", "target": "n1", "type": "curvedArrow", "size": 5 },
      { "id": "e1", "source": "n1", "target": "n2", "type": "curvedArrow" },
      { "id": "e2", "source": "n2", "target": "n0", "type": "curvedArrow" },
  
      { "id": "e3", "source": "n3", "target": "n4", "type": "arrow", "size": 3 },
      { "id": "e4", "source": "n4", "target": "n5", "type": "arrow", "size": 2 },
      { "id": "e5", "source": "n5", "target": "n3", "type": "arrow", "size": 1 }
    ]
  };
  
  // Initialize the Sigma graph
  const sigmaInstance = new sigma({ 
    graph: graphData,
    container: 'sigma-container',
    settings: {
      defaultNodeColor: '#ec5148',
      defaultEdgeType: 'arrow',
      minEdgeSize: 5,
      maxEdgeSize: 5
    }
  });
  
  // Refresh the edges. Comment this out to see the arrows...
  var types = [ 'line', 'curve', 'arrow', 'curvedArrow' ];
  sigmaInstance.graph.edges().forEach(function(e) { e.type = types[3]; });
  sigmaInstance.refresh();
  
  // Set initial zoom
  sigmaInstance.cameras[0].goTo({ x: 1, y: 1, angle: 0, ratio: 2.0 });
  
  // Add drag listener
  let dragListener = sigma.plugins.dragNodes(sigmaInstance, sigmaInstance.renderers[0]);</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>body {
     background: #ddd;
   }
   h1 {
     text-align: center;
   }
   .sigma-wrapper {
     max-width: 300px;
     background: #fff;
     border: 2px solid #AAA;
     margin: auto;
   }
   #sigma-container {
     max-width: 300px;
     height: 300px;
   }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/sigma.js/1.2.1/sigma.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/sigma.js/1.2.1/plugins/sigma.parsers.json.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/sigma.js/1.2.1/plugins/sigma.plugins.dragNodes.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/sigma.js/1.2.1/plugins/sigma.renderers.parallelEdges.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="https://cdn.rawgit.com/jacomyal/sigma.js/9c940aa9/src/renderers/canvas/sigma.canvas.edges.curve.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="https://cdn.rawgit.com/jacomyal/sigma.js/9c940aa9/src/renderers/canvas/sigma.canvas.edges.arrow.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="https://cdn.rawgit.com/jacomyal/sigma.js/9c940aa9/src/renderers/canvas/sigma.canvas.edges.curvedArrow.js"&gt;&lt;/script&gt;
  &lt;h1&gt;Sigma JS Workbench&lt;/h1&gt;
  &lt;div class="sigma-wrapper"&gt;
    &lt;div id="sigma-container"&gt;&lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>