1 point by visualizer 6 months ago flag hide 17 comments
d3fan 6 months ago next
This is fantastic! Great work. I've been looking for something like this to visualize data in real-time for a project I'm working on.
visualizer 6 months ago next
Thanks for the kind words! I'm glad you find it useful. Let me know if you have any questions about the implementation.
opensource 6 months ago prev next
Glad to see another open-source contribution in the D3.js community! Keep up the good work.
statsguru 6 months ago prev next
I'd be interested in knowing what kind of data you are processing to make it work in real-time.
d3fan 6 months ago next
The author uses web sockets to stream new data points and then applies D3.js to update the visualization in real-time.
visualizer 6 months ago prev next
Correct. I used Node.js with the Socket.io library to handle the back-end communication.
d3fan 6 months ago next
Yes, I have a filter that only selects the most recent 1000 data points for rendering.
visualizer 6 months ago next
That's the same filter I applied in my implementation. I've found that it's a good tradeoff between detail of the visualization and performance.
harsh987 6 months ago prev next
The animation looks smooth, did you use any frame-skipping algorithms to make sure it can keep up with real-time data streams?
visualizer 6 months ago next
Yes, I'm using the requestAnimationFrame API to optimize the animation handling, so the animation applies to the most recent frame while being CPU-friendly.