Piechart slice changes side and color when more than 50%

Dash Python
1

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:

Screenshot_2
Screenshot_2.png1323×589 42.3 KB

Here is my code:

#Pie declaration
html.Div([
                        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:
        try:
            cur.execute("""SELECT oee FROM monitor_prod WHERE intervalo = (SELECT MAX(intervalo) FROM monitor_prod)""")
        except:
            print("Fallo en transacción")
            conn.rollback()
            continue
        break 
    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))}
2

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

1 Like
3

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