Bring Drag & Drop to Dash with Dashboard Engine. 💫 Learn how at our next webinar!

Display multi bullet charts in two seperate rows in dash/plotly python

I would like to display multi bullet charts and icons using dash and plotly in separate rows. I would like them to display something like the image below. I’ve already implemented the multi bullet chart on one row. I’m having trouble placing another multi bullet chart beside this one with icons because of the domain x and y positioning. Here’s the code that I have so far. Once I get this I would be adding a drop down to display this information. The non-highlighted are is what I have so far according to the code below. The highlighted area is what I need. Thx.

fig.add_trace(go.Indicator(

mode = "number+gauge+delta", value = 180,

delta = {'reference': 200},

domain = {'x': [0.25, 1], 'y': [0.08, 0.25]},

title = {'text': "SV 3"},

gauge = {'shape': "bullet"}))

fig.add_trace(go.Indicator(

mode = "number+gauge+delta", value = 35,

delta = {'reference': 200},

domain = {'x': [0.25, 1], 'y': [0.4, 0.6]},

title = {'text': "SV 2"},

gauge = {'shape': "bullet"}))

fig.add_trace(go.Indicator(

mode = "number+gauge+delta", value = 220,

delta = {'reference': 200},

domain = {'x': [0.25, 1], 'y': [0.7, 0.9]},

title = {'text' :"SV 1"},

gauge= {'shape': "bullet"}))

fig.update_layout(height = 250, margin = {‘t’:1, ‘b’:1, ‘l’:1}, barmode= “group”)

fig.show()