Piechart slice changes side and color when more than 50%

So I have piechart in dash that updates itself every 10 seconds with 1 variable extracted from a database. The piechart has 2 slices only, oee and the other is 100-OEE (as OEE it represented as %). While OEE is less than 50% there is no problem, but when it reaches 50% the OEE slice changes side and color:

Here is my code:

#Pie declaration
                        dcc.Graph(id='monitor-oee', figure = {'data': []}, config={'displayModeBar': False}, animate=True),
                    ], className='column oee-container'),

#Update pie callback
@app.callback(Output('monitor-oee', 'figure'),
              [Input('graph-update', 'n_intervals')])
def update_pie_oee(n):
    while True:
            cur.execute("""SELECT oee FROM monitor_prod WHERE intervalo = (SELECT MAX(intervalo) FROM monitor_prod)""")
            print("Fallo en transacción")
    oee = cur.fetchall()[0][0]
    trace0 = go.Pie(
        values = [oee,100-oee],
        labels = ['OEE(%)',' '],
        hoverinfo = 'none',
        textinfo = 'label+percent',
        textfont = dict(size=20),
        marker = dict(colors=['#0080ff','#D3D3D3'],line=dict(color='#000000', width=2)),
    return {'data':[trace0],'layout': go.Layout(title = 'OEE (%)',showlegend=False,margin=go.layout.Margin(l=50,r=50,b=60,t=60))}

You should add sort=False inside go.pie, because the default for sort is True.

1 Like

I don’t know why when I first read the documentation I though that refered to the legend.