pythonplotlyplotly.graph-objects

plotly.graph_objects, how can i change \n my value


i m doing a graph and i want to "\n" my line but i dont find how can i do it: there is my graph:

enter image description here

And i would like to get something like:

Niveau
BLABLABLA
100%

I checked on the documentation but i don't find anything (i tried automargin=True, autorange=True, linewidth = 1

I don't think it's useful but there is my code :

from cgitb import text
import plotly.graph_objects as go
import numpy as np

labels = [5, 17, 39]


widths = np.array([10,20,10])

data = {
    "x1": [75,75,30],
    "x2": [75,0,45],
    "x3": [0,75,75],
}

x = [0, 4 , 12]
fig = go.Figure()

color = {
    "x1": '#E5EBF7',
    "x2":  '#D9CD9F',
    "x3":  '#F7F4E9',
}
for key in data:
    fig.add_trace(
        go.Bar(
        name=key,
        y=data[key],
        x= labels,

        width=widths,
        offset=0,
        customdata=np.transpose([labels, widths*data[key]]),
        texttemplate="%{y} x %{width} =<br>%{customdata[1]}",
        
        marker_color = color[key],
        textfont_color="white",
        textposition="inside",
        textangle=0,
        
        
        # hovertemplate="<br>".join([
        #     "label: %{customdata[0]}",
        #     "width: %{width}",
        #     "height: %{y}",
        #     "area: %{customdata[1]}",
        # ])
    ))



fig.update_layout({
    'plot_bgcolor': 'rgba(0, 0, 0, 0)',
    })


#les lignes
fig.add_shape( # add a horizontal "target" line
    type="line", line_color="black", line_width=3, opacity=1,
    x0=0, x1=55, y0=0, y1=0
)
fig.add_shape( # add a vertigal "target" line
    type="line", line_color="black", line_width=3, opacity=1,
    x0=4.5, x1=4.5, y0=0, y1=150
)


fig.add_shape( # add a lignes premier block line
    type="line", line_color="black", line_width=3, opacity=1, line_dash="dot",
    x0=5, x1=15, y0=75, y1=75
)

fig.add_shape( # add la ligne horizontale deuxieme block line
    type="line", line_color="black", line_width=3, opacity=1, line_dash="dot",
    x0=17, x1=37, y0=75, y1=75
)


fig.add_shape( # add la ligne horizontale deuxieme block line degressive
    type="line", line_color="green", line_width=3, opacity=1, line_dash="dot",
    x0=17, x1=37, y0=100, y1=77.5
)


fig.add_trace(go.Scatter(x=[17,37,37,17],
                         y=[100,77.5,75,75],
                         fill='toself',
                         fillcolor='#D9CD9F',
                         line=dict(width=0),
                         showlegend=False,
                         mode='lines'))


fig.add_shape( # add la ligne horizontale troisieme block line
    type="line", line_color="black", line_width=3, opacity=1, line_dash="dot",
    x0=39, x1=49, y0=75, y1=75
)



#ici on remplace les valeurs x (ecrites abcisses(ne plus avoir 10 20 30 40 mais trimestre1 etc)) (hard codées)
fig.update_xaxes(tickangle=0,
                 tickmode = 'array',
                tickvals = [10, 27, 45],
                 ticktext= ["Trimestre 1 à 3", "Trimestre 4 a 39", "Trimestre 40"])


fig.update_yaxes(tickangle=0,
                 tickmode = 'array',
                tickvals = [30, 75, 100],
                 ticktext= ["30%", "75%", "Niveau\nBLABLABLABLAB(100%)"],
                 automargin= True,
                 autorange = True,
                 linewidth = 1
                 ),
                 


fig.update_layout(barmode="stack",uniformtext=dict(mode="hide", minsize=10),
)



#ICI FAIRE EN SORTE S IL Y A 2 OU 3 BLOCS (OU MANIERE DYNAMIQUE MAIS JE N Y ARRIVE PAS)

#le premier parametre de range x, permet de mettre ou non un blanc entre le 0 et le premier bloc
fig.update_xaxes(range=[4,55])
fig.update_yaxes(range=[0,130])
fig.show()

Thank you for yours answers


Solution

  • plotly provides a graph environment on the web with web output and Dash, so html is enabled.

    fig.update_yaxes(tickangle=0,
                     tickmode = 'array',
                    tickvals = [30, 75, 100],
                     ticktext= ["30%", "75%", "Niveau<br>BLABLABLABLAB(100%)"],
                     automargin= True,
                     autorange = True,
                     linewidth = 1
                     ),
                    
    

    enter image description here