Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Link Colors not used when adding to graph #169

Closed
wendymungovan opened this issue Jan 30, 2019 · 7 comments
Closed

Link Colors not used when adding to graph #169

wendymungovan opened this issue Jan 30, 2019 · 7 comments
Assignees
Labels
bug

Comments

@wendymungovan
Copy link

@wendymungovan wendymungovan commented Jan 30, 2019

Describe the bug
When you add new links to a graph with the link color specified. The default color is used instead of the link.color field. This ONLY happens when you are updating an existing graph not creating a new one.

To Reproduce
Steps to reproduce the behaviour:

  1. Create a new graph with nodes and links of different colors

  2. add a new link to Graph's data

    var links = this.state.graphData.links;
    //add a new link
    {source:"A", target:"B", color:"red"}

    var newState = {
    graphData: { nodes: nodes, links: links}
    };
    this.setState( newState);

the color of the link is the default link color instead of red.

Expected behavior
The link color to be the color specified in the link.color property. (in example red) Instead the default link color is used.

@danielcaldas

This comment has been minimized.

Copy link
Owner

@danielcaldas danielcaldas commented Jan 30, 2019

Hi @wendymungovan! Thanks a lot for reporting this. Could you please provide your environment information (such as node version, react and d3 versions).

@wendymungovan

This comment has been minimized.

Copy link
Author

@wendymungovan wendymungovan commented Jan 30, 2019

Sorry about that.

"react": "^15.6.2",
"react-d3-graph": "^2.0.0-rc2",
"d3": "^3.5.16",
"react.pure.component": "^1.2.0",
"redux": "^3.5.2",

@LonelyPrincess LonelyPrincess self-assigned this Jan 31, 2019
@LonelyPrincess

This comment has been minimized.

Copy link
Collaborator

@LonelyPrincess LonelyPrincess commented Jan 31, 2019

Thank you for your detailed report, @wendymungovan ! Having the steps to reproduce the issue will come in handy. I'll take a look at this and let you know as soon as I find out what's going on. :)

@wendymungovan

This comment has been minimized.

Copy link
Author

@wendymungovan wendymungovan commented Jan 31, 2019

Thank you for looking into it. If we need to change what versions of node components we are using to make this work better please let me know.

@LonelyPrincess

This comment has been minimized.

Copy link
Collaborator

@LonelyPrincess LonelyPrincess commented Jan 31, 2019

Don't mention it! That's what we're here for! 😉

I found the problem and it's a bug in the library, so there's no need for you to do anything with your other dependencies. I'll submit a pull request with the fix soon, so @danielcaldas can review it. When a next release of react-d3-graph is ready, updating to the new version will solve the issue for you.

@LonelyPrincess LonelyPrincess added the bug label Jan 31, 2019
LonelyPrincess added a commit that referenced this issue Jan 31, 2019
When a new link was added in real time by updating an existing graph
instance, if it was configured to have a custom color with the
'link.color' property, that value was ignored and the default color was
displayed instead. This issue was reported in #169.

The source of the problem was that, when generating a d3Link instance in
the '_mapDataLinkToD3Link' method, the value of the color property was
not kept. Only the source and target values were being added to the
d3Link which would actually be rendered in the graph, and the color
property was completely lost by the time the graph was to be drawn on
the screen.

The issue could be solved by adding a color property to the d3Link
object.
@wendymungovan

This comment has been minimized.

Copy link
Author

@wendymungovan wendymungovan commented Feb 1, 2019

Thank you!

@danielcaldas danielcaldas added in progress and removed investigate labels Feb 3, 2019
danielcaldas added a commit that referenced this issue Feb 3, 2019
* fix: Add link with custom color in existing graph

When a new link was added in real time by updating an existing graph
instance, if it was configured to have a custom color with the
'link.color' property, that value was ignored and the default color was
displayed instead. This issue was reported in #169.

The source of the problem was that, when generating a d3Link instance in
the '_mapDataLinkToD3Link' method, the value of the color property was
not kept. Only the source and target values were being added to the
d3Link which would actually be rendered in the graph, and the color
property was completely lost by the time the graph was to be drawn on
the screen.

The issue could be solved by adding a color property to the d3Link
object.

* Whitelist new exposed props

* Make _mapDataLinkToD3Link work properly by picking custom props
@danielcaldas

This comment has been minimized.

Copy link
Owner

@danielcaldas danielcaldas commented Feb 3, 2019

Closed with #170

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
3 participants
You can’t perform that action at this time.