search

terezka / elm-charts

Create SVG charts in Elm.
https://www.elm-charts.org
BSD 3-Clause "New" or "Revised" License
736 stars 67 forks source link

`Chart.Events.getNearestX` does not work properly when the chart overflows it's container #92

Open oyshol opened 3 years ago

oyshol commented 3 years ago

Chart.Events.getNearestX (and Chart.Events.getNearest) seems to assume that the chart (with margins taken into account) start at the same coordinates as it's container. This becomes a problem if you let the chart overflow the container and then scroll in order to see the rest of the chart. As demostrated in this ellie example https://ellie-app.com/fjWqwCtT3PLa1, after scrolling to the right, the getNearestX function is no longer able to find the nearest point reliably.

By decreasing the size of the chart as the screen/window gets narrower, details in chart get less clear and the axis labels become hard to read. On the other hand, tooltips and legends keep their original size on narrow screens and do not match the shrunken chart. The use of overflow preserv the original sizes.

It seems like the assumption stems from the Internal.Svg.decoder function, but I'm not sure how to change it.

terezka commented 3 years ago

I'm not sure how to fix this yet! One way around it is to add the overflow-x prop closer to the chart like in this ellie. I'll think about it and get back with I fix once I find one! In the meantime, thank you for your patience. :)