Comments (10)
Thanks for the feedback! I will consider it. What are you doing in the tooltip function that takes so much time?
from react-d3-components.
Since I would like to "preview" the selected data in other components, I simply set the data into the state of the father component. And a change to that data will cause all related components to update. So if user moves mouse too fast, the page will be just too busy handling all these state updating to respond to incoming mouse move events.
from react-d3-components.
Honestly, I just use tooltipLine function as "onSelectedDataChange" event handler.
from react-d3-components.
I see, I was thinking about changing the mouse stuff anyhow since your Issue about events. So I might use RxJS and debounce it!
from react-d3-components.
Please don't put this in the library as a standard feature. I'd expect most people don't do expensive stuff in their tooltip handlers, and it's easy enough to handle this yourself as the OP demonstrated :)
from react-d3-components.
True. Ultimately I want it to be broadly usable without too much forced standards etc, so in case I change it, should be optional.
from react-d3-components.
I just learned that the official name for this is "debounce". It seems to be a widely applied technique to prevent browser-based JavaScript applications from firing events too often that it bricks UI responsiveness.
Just put it here in case someone needs further information.
Edit: Oh and I just noticed that codesuki mentioned this in an earlier reply. Did not catch the meaning of that at the first time.
from react-d3-components.
Also keep in mind the difference between debounce and throttle. I would have to think more about which one is appropriate in this case. Here's a thread with resources on it from dc.js:
from react-d3-components.
Thanks @jefffriesen for the info I will have a look.
BTW the library is still evolving. I am almost finished adding transition support, the problem I have to solve now is to transition not only for example the line graph but also the labels and tooltip. I use this chance to rethink the components and tooltips, too (as talked about in the the other issues.)
from react-d3-components.
Cool. Looking forward to seeing out transitions turn out.
from react-d3-components.
Related Issues (20)
- Feature Suggestion: Having a line when hovering over the chart HOT 1
- Responsive chart HOT 1
- Series colors
- X-axis is not showing in the graph with smaller Y-axis value
- PieChart not rendering HOT 1
- Documentation HOT 1
- Bar Chart Tootlip & tickFormat with image
- dots in tooltip not showing correctlly while hovering HOT 1
- toolTip not working properly on line chart
- Q: Is support react native?
- Is this repo still maintained? HOT 2
- I want to pass xscale value to Bar Chart, how to achieve that!
- PieChart hides label when data is unevenly distributed HOT 4
- Interested to maintain the project HOT 4
- How to customize strokeColor for LineChart? HOT 1
- how to increase column width of barchar and yAix value default like 0 to 100
- How to add stroke color for area chart HOT 1
- NPM vulnerability HOT 1
- 同学,您这个项目引入了615个开源组件,存在27个漏洞,辛苦升级一下
- Integrating D3 into a Vite-TS Project
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-d3-components.