-5

Is there a way to make a Bar Chart not be this small? I have thousands of horizontal bars in my chart, so I want to scroll up/down and every time I add a new plot the chart data keeps shrinking? I want to keep scrolling without any changes in size, is this possible?

import pandas as pd import plotly.graph_objects as go from dash import Dash, html, dcc # Load data from CSV csv_file = 'prices.csv' df = pd.read_csv(csv_file) # Create the Dash app app = Dash(__name__) # Define the layout of the app app.layout = html.Div( [ dcc.Graph( figure=go.Figure( data=[go.Bar(y=df['price'], x=df['list'], orientation='h')], layout={ 'height': 2500 # Adjust height to control scrollbar visibility } ) ), ], style={ 'overflow-y': 'auto', 'height': 800 # Set a fixed height for the scrollable area } ) if __name__ == '__main__': app.run(debug=True)

What it presently looks like: enter image description here

At the end I want to achieve a plot like below (Source: Random Image on the Internet)` enter image description here

Improve this question
4
  • you have too many different elements in data - and some of them has bigger value - and this can make all your proble. You have to reduce your data. OR you have to change height to much bigger. Commented May 2 at 20:11
  • maybe you could ask on Plotly's forum: Add scrolling options to plots - Dash Python - Plotly Community Forum Commented May 2 at 20:13
  • how many items do you have in dataset? Maybe you could create random data in code - so we could copy all code and test it. Commented May 2 at 20:16
  • 1
    Please don't change an answered question in a way that invalidates the given answers and please don't ask follow up questions in the comments. If you have new question, the correct way is to ask a new question. Commented May 2 at 22:37

1 Answer 1

Reset to default
3

I'm indebted to this answer.

enter image description here

The code that produced the scrollable figure is below, using only Numpy and Matplotlib.

import numpy as np import matplotlib.pyplot as plt from matplotlib.widgets import Slider from itertools import product n_bars = 100 n_shown = 10 names = ["".join(t) for t in product("ABCDE", "ABCDE", "ABCDE")][:n_bars] np.random.seed(20250502) values = np.random.randint(1, 11, n_bars) fig, ax_d = plt.subplot_mosaic("a" * 7 + "b") ax_d["a"].barh(names, values) ax_d["a"].axis([-0.2, 10.2, -0.5, n_shown-0.5]) ax_d["a"].invert_yaxis() spos = Slider(ax_d["b"], "", -0.5, n_bars-n_shown-0.5, orientation="vertical") def update(val): pos = spos.val ax_d["a"].axis([-0.2, 10.2, pos+n_shown, pos]) fig.canvas.draw_idle() spos.on_changed(update) plt.show()

The code above is OK, but I want to post a more refined (overly refined?) version of it… that somehow addresses the OP desire of an answer dealing with data incoming from a CSV file: below, I write a CSV file from my data and next I read from it (3 statements, no external modules).

enter image description here

Below the code, it's quite longer than the original one, but not more complex. Note that I've inverted the direction of scrolling and suppressed the display of the value from the Slider object.

import numpy as np import matplotlib.pyplot as plt from matplotlib.widgets import Slider from itertools import product # create some data n_bars = 100 _names = ["".join(t) for t in product("ABCDE", "ABCDE", "ABCDE")][:n_bars] np.random.seed(20250502) _values = np.random.randint(1, 11, n_bars) # write data to CSV with open("dummy.csv", "w") as out: out.write("Names,Values\n") for n, v in zip(_names, _values): out.write("%s,%d\n" % (n, v)) # read data from CSV with open("dummy.csv") as inp: inp.readline() names, values = zip( *[[n, int(v)] for n, v in [line.strip().split(",") for line in inp.readlines()]] ) # how many data points? how many bars in the scrollable window n_bars = len(names) n_shown = 10 # we need an Axes for the bars, a thinner Axes for the Slider bars, slider = "b", "s" fig, ax_d = plt.subplot_mosaic(bars * 19 + slider, layout="constrained") fig.suptitle("A Scrollable Window Over a Largish Plot") # plot the bars ax_d[bars].barh(names, values) ax_d[bars].axvline(color="grey", lw=1) ax_d[bars].set_xlabel("Value") ax_d[bars].set_ylabel("Name") # adjust x- and y-axis limits ax_d[bars].set_xlim(xmin=-0.2) ax_d[bars].set_ylim([-0.5, n_shown - 0.5]) # inverting the y-axis forces the names to go from top to bottom ax_d[bars].invert_yaxis() # instantiate the Slider inside the thinner Axes s = Slider( ax_d[slider], "", 0, n_bars - n_shown, orientation="vertical", valinit=0, valstep=1 ) s.valtext.set_visible(False) # ty https://stackoverflow.com/a/15477329/2749397 ax_d[slider].invert_yaxis() # the callback def update(val): # higher y value comes first because I've inverted the y-axis ax_d[bars].set_ylim([val + n_shown - 0.5, val - 0.5]) fig.canvas.draw_idle() # when we call the callback? s.on_changed(update) # That's All Folks plt.show()
Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

This is exactly what I want, thank you. How would I use this with a CSV file?
@D3AD_SHOT This is another question, whose answer depends on the format of your data and on how you want to manipulate your data.
@D3AD_SHOT I have added a second piece of code where I read the data from a CSV file, I don't know if what I've done is what you want, but I've put in my effort… :-)

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.