2

I am displaying a Plotly chart in a Streamlit app. When I run the app locally, the chart looks the way I want it to. However, when I deploy the app inside a Docker container, the chart looks different. Does anyone know why the formatting would be different when running inside a Docker container?

Here is how the chart looks when I run my app locally Python 3.9.7:

enter image description here

and here is how it looks when I run it inside the Docker container:

enter image description here

There are several differences:

  • The title font is different
  • The plot takes up a wider area in the Docker version
  • The gridlines are a different color and there are no vertical gridlines in the Docker version
  • The plot background is a different color
  • There is less vertical space between the subplots in the Docker version

It seems in the Docker container some additional styling is not being applied. Does anyone know why that might be?


Here is some Python code for a basic reproducible example:

import streamlit as st
import plotly.graph_objects as go
from plotly.subplots import make_subplots

# I tried this workaround suggested in another answer, but it didn't help
import plotly.io as pio
pio.templates.default = 'plotly'


fig = make_subplots(rows=2, cols=1)

x_line = [1, 2, 3, 4, 5]
y_line = [10, 12, 8, 15, 7]

x_bar = ['A', 'B', 'C', 'D', 'E']
y_bar = [20, 15, 25, 18, 22]

fig.add_trace(go.Scatter(x=x_line, y=y_line, mode='lines', name='Line Chart'), row=1, col=1)
fig.add_trace(go.Bar(x=x_bar, y=y_bar, name='Bar Chart'), row=2, col=1)
fig.update_layout(title_text='Subplots with Line and Bar Charts', showlegend=True)

st.plotly_chart(fig)

And here is my Dockerfile:

FROM python:3.9-slim

COPY requirements.txt requirements.txt

# Install your requirements
RUN python -m pip install --upgrade pip
RUN python -m pip install -r requirements.txt

# Copy local app directory into app direcetory in Docker container.
# The example python code above is in `app/app.py`
COPY app app

EXPOSE 8080

CMD ["python", "-m", "streamlit", "run", "app/app.py", "--server.port=8080", "--server.address=0.0.0.0", "--server.enableWebsocketCompression=false"]

requirements.txt:

streamlit==1.12.0
plotly==5.18.0
4
  • Do you mean the grid and background color? Commented Nov 10, 2023 at 23:31
  • 1
    @rpanai Yes, and I edited the original question to point out a few more differences. Commented Nov 10, 2023 at 23:45
  • "And here is my Dockerfile:" - how did you determine what to put in here? What is in the requirements.txt? What versions of Python, plotly, etc. are used when you try the code locally, and how did you verify this? To be clear, the Python code that you show is the app/app.py file in this example? Commented Nov 10, 2023 at 23:57
  • 1
    @KarlKnechtel I updated the original question with the Python and package versions I'm using. And yes, the Python code is in app/app.py (I also added this to the original question) Commented Nov 11, 2023 at 0:16

1 Answer 1

1

I was able to resolve the issue by pinning more package versions. Specifically, I had to specify altair==4.2.2, which is strange because I'm not using altair in my code.

My requirements.txt file now looks like this:

# requirements.txt

streamlit==1.12.0
plotly==5.18.0
altair==4.2.2
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.