Horizontal scrolling graph

mstlouis6595 · 2025-03-01T03:30:44.009Z

I have a graph on my app that has one datapoint per day. After 30+ days a data it starts to get hard to really see the data properly because it gets too busy. I want to make a graph more user friendly and have it only display 30 data points at a time and make it so we can scroll left and right to go farther back in time.

Maybe have a zoom in and out button as well to show more or less datapoints at a time even.

What’s the best way to add these features onto my graphs? Do I need a different plug-in or can the standard Bubble built in graphs plugin handle this somehow?

hi.luisacosta · 2025-03-01T05:30:08.052Z

AFAIK — can’t do this with any chart plugin I’ve tried in Bubble.

When dealing with charts; I like to use apps like Robinhood, Coinbase; Apple Stocks to see how they design their charts to be viewed on small screens.

Usually this is done not by zooming or scrolling but by having buttons for 1Day 1Week 1Month 1Yr 5Yr AllTime — basically changing the date range with a button click

It’s still the same chart area but the data points are plotted relative to the selection.

For example you could have arrows below the chart that change the date range, which is just changing the data points in the chart.

Hope that helps you find a solution (:

hi.luisacosta · 2025-03-01T05:31:39.994Z

IMG_75441179×1286 135 KB

mstlouis6595 · 2025-03-01T17:20:10.633Z

Thanks for the suggestion, this is mainly what I had come up with as an idea so far as well. Wish there was a way to swipe. I guess we maybe could have a custom script do it but probably not worth the effort.

hi.luisacosta · 2025-03-01T17:41:51.838Z

I mean you could get someone to swipe, basically the same as clicking < or > buttons below the graph.

Say that every time you click an Arrow < or >, then it changes the date range in the chart. If that works then you can use swipe actions.

I also don’t think it’s worth the effort to introduce build & maintenance complexity.

moon · 2025-03-01T18:21:49.967Z

you can use an repeating group for that, you would basically have a bit mor complex setup for that but way more indivdual, every cell would represent a state if this level is reached the elements in there could be also assigned with like nested elements so you would refer to eg each groupe in the rgs cell to an individual point so if row 1 has 30 cells each cell would have additional 5 for example and so on this would be soley made with coditions and indexing