Pattern_shape does not work correctly in streamlit app

[Szymon_Skrobiszewski]

Hey, I use plotly to create charts and share them on Streamlit. However, I encountered a problem, locally everything works fine, but when I upload to streamlit it does not work. Any advice?

[Charly_Wargnier]

Thanks for your question, @Szymon_Skrobiszewski!

Can you please send us the code?

Thanks,
Charly

[Szymon_Skrobiszewski]

Sure, thanks for interest. I need Pattern Shape for a larger project. I thought it was maybe some pre-settings of the application, so I made some simple graph without any settings.

import streamlit as st
import plotly.graph_objects as go


st.set_page_config(
    page_title="x",
    initial_sidebar_state="expanded"
)


conceded_and_scored_goals = {
    'GSWPP': [10, 15],
    'GSWDP': [5, 8]
}

hex_colors = ['#FF5733', '#33FF57']
symbols = ['/', '']
names = ['Pierwsza', 'Druga']

fig = go.Figure()

for i, (color, symbol, name) in enumerate(zip(hex_colors, symbols, names)):
    fig.add_trace(
        go.Bar(
            x=['Pierwsza', 'Druga'],
            y=[
                conceded_and_scored_goals['GSWPP'][i],
                conceded_and_scored_goals['GSWDP'][i],
            ],
            marker=dict(
                color=color,
                pattern_shape=symbol
            ),
            text=[
                conceded_and_scored_goals['GSWPP'][i],
                conceded_and_scored_goals['GSWDP'][i],
            ],
            textfont=dict(size=18, color='white'),
            hovertemplate=[
                f'Liczba strzelonych bramek drużyny {name}: <b>%{{y}}</b>'
                + '<extra></extra>',
                f'Liczba strzelonych bramek drużyny {name}: <b>%{{y}}</b>'
                + '<extra></extra>'
            ],
            name=name
        )
    )

st.plotly_chart(fig)

[Charly_Wargnier]

Which version of Plotly are you using?

If it’s not the latest, the error is possibly related to an outdated version of Plotly, and I would recommend upgrading via the following pip command:

pip install plotly --upgrade

Let me know

Thanks,
Charly

[Szymon_Skrobiszewski]

Version Plotly: 5.14.1, now I am using 5.16.1 and I uploaded streamlit too but effect is still the same.
In your local app code works properly?

Thanks.

[Charly_Wargnier]

Thanks, @Szymon_Skrobiszewski!

Would you mind checking if the Plotly version you’re using on your local machine matches the one on Streamlit Community Cloud? If they’re the same, there could be a potential bug.

Thanks,
Charly

[Szymon_Skrobiszewski]

I didn’t upload the app to the cloud, I fired it up locally in cmd. What do you mean the versions may not match? What can I do to fix that?

Thanks.

[edsaac]

If setting a pattern, you will need to pass a pattern_bgcolor, because that will override the color property.

From your example:

import streamlit as st
import plotly.graph_objects as go


st.set_page_config(
    page_title="x",
    initial_sidebar_state="expanded"
)


conceded_and_scored_goals = {
    'GSWPP': [10, 15],
    'GSWDP': [5, 8]
}

hex_colors = ['#FF5733', '#33FF57']
symbols = ['/', '']
names = ['Pierwsza', 'Druga']

fig = go.Figure()

for i, (color, symbol, name) in enumerate(zip(hex_colors, symbols, names)):
    fig.add_trace(
        go.Bar(
            x=['Pierwsza', 'Druga'],
            y=[
                conceded_and_scored_goals['GSWPP'][i],
                conceded_and_scored_goals['GSWDP'][i],
            ],
            marker=dict(
                color=color,
                pattern_shape=symbol,
                pattern_bgcolor="pink"
            ),
            text=[
                conceded_and_scored_goals['GSWPP'][i],
                conceded_and_scored_goals['GSWDP'][i],
            ],
            textfont=dict(size=18, color='white'),
            hovertemplate=[
                f'Liczba strzelonych bramek drużyny {name}: <b>%{{y}}</b>'
                + '<extra></extra>',
                f'Liczba strzelonych bramek drużyny {name}: <b>%{{y}}</b>'
                + '<extra></extra>'
            ],
            name=name
        )
    )
st.plotly_chart(fig)

Check the docs at Bar traces in Python.

---

@Szymon_Skrobiszewski

However, I encountered a problem, locally everything works fine, but when I upload to streamlit it does not work

What did you mean by uploading it to streamlit if it was not to the community cloud?

[Szymon_Skrobiszewski]

I ran on the command line. I didn’t share via Stream cloud, which means only I could see the apps, couldn’t provide a link etc. But it doesn’t matter, thanks for the help.