0

Here I want to reduce the space between two graphs, but I couldn't. Here is the code

import dash                     # pip install dash
from dash.dependencies import Input, Output, State
import dash_core_components as dcc
import dash_html_components as html
import plotly.express as px     # pip install plotly==5.2.2
import plotly.graph_objects as go
import pandas as pd             # pip install pandas

df_fddevents = pd.DataFrame([
    dict(Event="On", EventStartTime='2022-01-01 08:00:00', EventEndTime='2022-01-01 16:45:00', Point="Switch1", width=0.5),
    dict(Event="Off", EventStartTime='2022-01-01 16:45:00', EventEndTime='2022-01-02 08:00:00', Point="Switch1", width=0.3),
    dict(Event="On", EventStartTime='2022-01-02 08:00:00', EventEndTime='2022-01-02 16:45:00', Point="Switch1", width=0.5),
    dict(Event="On", EventStartTime='2022-01-01 08:00:00', EventEndTime='2022-01-01 10:00:00', Point="Switch2", width=0.3),
    dict(Event="Off", EventStartTime='2022-01-01 10:00:00', EventEndTime='2022-01-01 13:45:00', Point="Switch2", width=0.5),
    dict(Event="On", EventStartTime='2022-01-02 08:00:00', EventEndTime='2022-01-02 16:00:00', Point="Switch2", width=0.3)])

print(df_fddevents)
fig_gantt = px.timeline(df_fddevents, x_start="EventStartTime", x_end="EventEndTime", y="Event", color="Point", height=250)
fig_gantt.update_yaxes(autorange="reversed")
fig_gantt.update_layout(hovermode="x unified")
for i, d in enumerate(fig_gantt.data):
    d.width = df_fddevents[df_fddevents['Point']==d.name]['width']
fig_gantt.show()
#Line Chart for all analog points
df2 = pd.DataFrame([
    dict(DateTime='2022-01-01 00:00:00', Value=90, Point="A", Unit='%', DataType='Normal'),
    dict(DateTime='2022-01-01 00:15:00', Value=80, Point="A", Unit='%', DataType='Normal'),
    dict(DateTime='2022-01-01 00:30:00', Value=85, Point="A", Unit='%', DataType='Normal'),
    dict(DateTime='2022-01-01 00:45:00', Value=92, Point="A", Unit='%', DataType='Normal'),
    dict(DateTime='2022-01-01 01:00:00', Value=100, Point="A", Unit='%', DataType='Fault'),
    dict(DateTime='2022-01-01 01:15:00', Value=72, Point="A", Unit='%', DataType='Fault'),
    dict(DateTime='2022-01-01 00:00:00', Value=22, Point="B", Unit='°C', DataType='Normal'),
    dict(DateTime='2022-01-01 00:15:00', Value=22, Point="B", Unit='°C', DataType='Normal'),
    dict(DateTime='2022-01-01 00:30:00', Value=23, Point="B", Unit='°C', DataType='Normal'),
    dict(DateTime='2022-01-01 00:45:00', Value=20, Point="B", Unit='°C', DataType='Normal'),
    dict(DateTime='2022-01-01 01:00:00', Value=21, Point="B", Unit='°C', DataType='Fault'),
    dict(DateTime='2022-01-01 01:15:00', Value=23, Point="B", Unit='°C', DataType='Fault'),    
    dict(DateTime='2022-01-01 00:00:00', Value=24, Point="C", Unit='°C', DataType='Normal'),
    dict(DateTime='2022-01-01 00:15:00', Value=24, Point="C", Unit='°C', DataType='Normal'),
    dict(DateTime='2022-01-01 00:30:00', Value=24, Point="C", Unit='°C', DataType='Normal'),
    dict(DateTime='2022-01-01 00:45:00', Value=24, Point="C", Unit='°C', DataType='Normal'),
    dict(DateTime='2022-01-01 01:00:00', Value=24, Point="C", Unit='°C', DataType='Fault'),
    dict(DateTime='2022-01-01 01:15:00', Value=24, Point="C", Unit='°C', DataType='Fault'),
    dict(DateTime='2022-01-01 00:00:00', Value=60, Point="D", Unit='Pa', DataType='Normal'),
    dict(DateTime='2022-01-01 00:15:00', Value=58, Point="D", Unit='Pa', DataType='Normal'),
    dict(DateTime='2022-01-01 00:30:00', Value=62, Point="D", Unit='Pa', DataType='Normal'),
    dict(DateTime='2022-01-01 00:45:00', Value=61, Point="D", Unit='Pa', DataType='Normal'),
    dict(DateTime='2022-01-01 01:00:00', Value=64, Point="D", Unit='Pa', DataType='Fault'),
    dict(DateTime='2022-01-01 01:15:00', Value=59, Point="D", Unit='Pa', DataType='Fault'),
    dict(DateTime='2022-01-01 00:00:00', Value=0, Point="E", Unit='Binary', DataType='Normal'),
    dict(DateTime='2022-01-01 00:15:00', Value=0, Point="E", Unit='Binary', DataType='Normal'),
    dict(DateTime='2022-01-01 00:30:00', Value=1, Point="E", Unit='Binary', DataType='Normal'),
    dict(DateTime='2022-01-01 00:45:00', Value=1, Point="E", Unit='Binary', DataType='Normal'),
    dict(DateTime='2022-01-01 01:00:00', Value=1, Point="E", Unit='Binary', DataType='Fault'),
    dict(DateTime='2022-01-01 01:15:00', Value=1, Point="E", Unit='Binary', DataType='Fault'),
    dict(DateTime='2022-01-01 01:30:00', Value=0, Point="E", Unit='Binary', DataType='Normal'),
    dict(DateTime='2022-01-01 01:45:00', Value=0, Point="E", Unit='Binary', DataType='Normal'),
    dict(DateTime='2022-01-01 02:00:00', Value=1, Point="E", Unit='Binary', DataType='Normal'),
    dict(DateTime='2022-01-01 02:15:00', Value=1, Point="E", Unit='Binary', DataType='Normal'),
    dict(DateTime='2022-01-01 02:30:00', Value=1, Point="E", Unit='Binary', DataType='Normal'),
    dict(DateTime='2022-01-01 02:45:00', Value=1, Point="E", Unit='Binary', DataType='Normal'),
])

figline = px.line(df2, x="DateTime", y="Value", color="Point", line_group="Unit", hover_name="Point", facet_row="Unit",
        line_shape="spline", render_mode="svg")
#figline.update_xaxes(zeroline=True, zerolinewidth=2, zerolinecolor='LightPink')
#figline.update_xaxes(ticks= "inside",tickson ="boundaries", tickcolor= "#16537e", ticklen=70,)
#figline.update_yaxes(ticks="inside",tickcolor= "#16537e", tickson ="boundaries", ticklen=950)
figline.update_xaxes(showgrid=True, gridwidth=10, gridcolor='red')
figline.update_yaxes(showgrid=True, gridwidth=1, gridcolor='red')
figline.update_yaxes(autorange=True)
figline.update_layout(hovermode="x unified")
figline.show()

Here this is the problem where two graphs are plotted in plotly but the space between them is too far

it is the expected solution where two graphs are situated not so far it is the another expected solution where two graphs are situated in single axis

Sartaj0111
  • 11
  • 1
  • To close the gap between two graphs without using subplots, change the margin settings. `fig_gantt.update_layout(margin={'t':20,'b':0,'l':0,'r':0})`, `figline.update_layout(margin={'t':0,'b':0,'l':0,'r':0})` – r-beginners Jun 14 '22 at 02:23
  • How can marge the x axis of both the chart? I want to use the x axis of the second chart which is line chart for both the chart – Sartaj0111 Jun 14 '22 at 05:28
  • See this:[https://stackoverflow.com/questions/55704058/plotly-how-to-set-the-range-of-the-y-axis](https://stackoverflow.com/questions/55704058/plotly-how-to-set-the-range-of-the-y-axis) – r-beginners Jun 14 '22 at 05:55

0 Answers0