Open GeorgeBerdovskiy opened 3 months ago
Quick note - I said "dot plot" in the title while the picture clearly has a line graph. It doesn't really matter which one you choose to enhance with tooltips because we'll end up copying your code to the other one anyways. But please pick one to make things easy!
Otherwise whenever you make a change for the dot plot, you'll need to make that same change for the line plot, and vice-versa... big headache!
Background
Due to PR #34, PureChart finally supports dot plots and line graphs! However, they are too simple to be used practically. While other contributors work on rendering the axes (#35, #36) we want to simultaneously add some fancy effects and interactivity.
Goal
Add a tooltip that appears when hovering over a point on the plot. This tooltip should use the same animation and styling as the lollipop chart tooltips - check out the HTML and CSS for those in
app/views
. Use the picture below for guidance.You will need to get creative! Intuitively, you'll want to draw a separate tooltip for every single point and generate some CSS to display each one when hovering over its respective point. While this isn't easy, it's 100% doable with some elbow grease. Good luck 🚀