strathausen / dracula

JavaScript layout and representation of connected graphs.
https://www.graphdracula.net
MIT License
836 stars 132 forks source link

edge styles are not detected during rendering #42

Closed bagnus closed 7 years ago

bagnus commented 7 years ago

Case test with last Dracula version :

graph.addEdge('Dragonfruit', 'Banana');
graph.addEdge('Kiwi', 'Banana', { directed : true } );
graph.addEdge('Banana', 'id35',{ stroke : "#f00" , fill : "#56f", label : "test" });

Default renderer doesn't draw arrows or other styles inside {}.

This problem is that function Connection() expects style as third parameter, but receives always a null var from function drawEdge().

So I changed this original code:

    key: 'addEdge',
    value: function addEdge(source, target) {
    var edgeData = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};

writing this:

    key: 'addEdge',
    value: function addEdge(source, target) {
    var edgeData = {};
    if(arguments.length > 2 && arguments[2] !== undefined) {edgeData.style = arguments[2];}

In this way works; let me know if it's the best way to fix it.

Regards, Andrea

kavishdahekar commented 7 years ago

Better way to do it would be to add style as the third parameter to the addEdge function..

key: 'addEdge',
    value: function addEdge(source, target, style) {
      var edgeData = {}; //create the edgeData object

      var sourceNode = this.addNode(source);
      var targetNode = this.addNode(target);
      edgeData.style = style; //set the style parameter, will be undefined when no style is passed
      edgeData.source = sourceNode;
      edgeData.target = targetNode;
      this.edges.push(edgeData);
      sourceNode.edges.push(edgeData);
      targetNode.edges.push(edgeData);
      return edgeData;
    }
strathausen commented 7 years ago

@bagnus can you try to put the styles into a style parameter and confirm that it works? Like this: graph.addEdge('Banana', 'id35', { style: { stroke : "#f00" , fill : "#56f", label : "test" } });