'How to graph some events with time on x-axis with plotly express?

I'm trying to build a dashboard using plotly dash and I have data that looks like this :

data

Here the text data:

data={'SECTOR':['KHN','KHN','KHN','KHN','KHN','KHN'],
"NAME": ["ELSILATE","ELSILATE","ELSILATE","ELSILATE","ELSILATE","ELSILATE"],
"TIME" : ["4:00", "4:25","4:45", "5:03", "6:00","7:00"],
"POINT_NAME":["ZERAEIN","ZERAEIN","ZERAEIN","ZERAEIN","ZERAEIN","ZERAEIN"],
"MESSAGE":["Change Status","Operator Control","Return to Normal", 
"Operator Control", "Return to Normal","Return to Normal"],
"VALUE":["OPEN","CLOSE","NORMAL","OPEN","NORMAL","CLOSE"],
"ch_open":[1,0,0,0,0,0],
"ch_close":[0,2,0,0,0,0],
"normal_open":[0,0,3,0,0,0],
"command_open":[0,0,0,4,0,0],
"command_close":[0,0,0,0,5,0],
"normal_close":[0,0,0,0,0,6]}

df_cb=pd.DataFrame(data)

I used pandas to show a number for every event. I want to show the time versus the event of open/close/normal/control,close,etc. for every sector, name, adn point_name !

I manage to get it like this

output

from a code on the internet but I can't think of a way to show time in x-axis

Here is the code:

import matplotlib.pyplot as plt
import numpy as np

#for a specific line cb :


df_ex = df_cb.loc[df_cb['POINT_NAME'].str.contains('ZERAEIN')]
ch_open=list(df_ex["ch_open"])
ch_close=list(df_ex["ch_close"])
normal_open=list(df_ex["normal_open"])
normal_close=list(df_ex["normal_close"])
command_open=list(df_ex["command_open"])
command_close=list(df_ex["command_close"])


data = [ch_open,
        ch_close, 
        normal_open,
       normal_close,
       command_open,
       command_close]

fig = plt.figure()
ax = fig.add_subplot(111)
ax.axes.get_yaxis().set_visible(False)
ax.set_aspect(1)

def avg(a, b):
    return (a + b) / 2.0

for y, row in enumerate(data):
    for x, col in enumerate(row):
        x1 = [x, x+1]
        y1 = [0, 0]
        y2 = [1, 1]
        if col == 1:
            plt.fill_between(x1, y1, y2=y2, color='yellow')
            plt.text(avg(x1[0], x1[1]), avg(y1[0], y2[0]), "A", 
                                        horizontalalignment='center',
                                        verticalalignment='center')
        if col == 2:
            plt.fill_between(x1, y1, y2=y2, color='red')
            plt.text(avg(x1[0], x1[0]+1), avg(y1[0], y2[0]), "B", 
                                        horizontalalignment='center',
                                        verticalalignment='center')
        if col == 3:
            plt.fill_between(x1, y1, y2=y2, color='orange')
            plt.text(avg(x1[0], x1[0]+1), avg(y1[0], y2[0]), "C", 
                                        horizontalalignment='center',
                                        verticalalignment='center')
        if col == 4:
            plt.fill_between(x1, y1, y2=y2, color='brown')
            plt.text(avg(x1[0], x1[0]+1), avg(y1[0], y2[0]), "D", 
                                        horizontalalignment='center',
                                        verticalalignment='center')
        if col == 5:
            plt.fill_between(x1, y1, y2=y2, color='green')
            plt.text(avg(x1[0], x1[0]+1), avg(y1[0], y2[0]), "E", 
                                        horizontalalignment='center',
                                        verticalalignment='center')
        if col == 6:
            plt.fill_between(x1, y1, y2=y2, color='black')
            plt.text(avg(x1[0], x1[0]+1), avg(y1[0], y2[0]), "F", 
                                        horizontalalignment='center',
                                        verticalalignment='center')

plt.ylim(1, 0)
plt.show()

would be nice to have it like this with time shows as x-axis:

output



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source