dash-docs
dash-docs copied to clipboard
plotly
D3 + React + Dash - Feedback Thread
This is a placeholder issue to get feedback from users about our "React + D3" guides.
How did it go? What did we leave out? Let us know in this issue!
Just wanted to say thanks for putting this out there. I'm just getting started with the Dash D3.js Network Graph, but hope to implement it soon as it would be very helpful for our project.
Hey! the templates work great and I was able to make my own D3.js custom component for dash that works well.
I am only stuck at how to remove the element when updating it. Whenever a callback creates a component or updates it, the new component renders over the old one, without removing. What is the recommended way of resolving this?
The normal D3 pattern is to bind the components you're creating to some data - if it's a single component you'll reuse and modify when receiving a callback update that data could just be a length-1 placeholder array eg .data([0]) - and you only create a new element in the enter() selection. I should note though that our tutorial uses d3v3 patterns, and these patterns have changed in v4 and v5 so it's possible if you're using our example code directly with a newer d3 version it could behave in unexpected ways.
A bit late, but I did manage to get it to work. Indeed, I was using the enter() and exit() method wrong. Thanks for the suggestion!
Hi there!
I've been using Dash for the past few months and I am very happy with the flexibility it provides in terms of UI, so huge thanks for all the nice work done.
The two examples provided are nice starting points and easy to follow IMO (I am much more comfortable with d3 than React).
It would be a cool addition to have an example using a functional component + hooks, as this seems to be the "popular way" of integrating D3 and React more recently. Do you have plans to update these examples or add new ones?
