Is there a way to merge/embed multiple Plotly HTML files into one page/HTML file offline?

Viewed 2883

I'm trying to combine multiple charts into one HTML report to send out. The thing is I don't really think subplotting is the best idea because the charts are relatively unrelated (different X/Y axes). All I need to do is just append the charts into 1 HTML file. There is a guide that explains how to do it using plotly URLs, but I don't want to rely on an internet connection for automated reporting, and I want to be able to view these reports online

I'm trying to create an HTML report that simply just appends multiple plotly plots into one HTML file instead of having several individual HTML files. The charts aren't really related, so not interested in creating subplots. In theory it's just an HTML file, so I can just copy and paste the code a certain way and have them both show up, right?

Documentation I'm referring to: https://plot.ly/python/html-reports/

2 Answers

create a grid layout in the format you want, and then programmatically insert the html into the grid

Here a suggestion based on https://stackoverflow.com/a/58336718/4286380

def plot_list(df_list):
    fig_list =[]
    from plotly.subplots import make_subplots

    # Creation des figures
    i=0
    for df in df_list:
        i+=1
        fig = go.Figure()
        fig.add_trace(go.Scatter(x=list(df.Date), y=list(df.Temp), name="Température"))

        # Add figure title
        fig.update_layout(
            title_text=f"Cas n°{i}")

        # Set x-axis title
        fig.update_xaxes(title_text="Date")

        fig_list.append(fig)

    # Création d'un seul fichier HTML
    filename=f"{os.path.join('output', 'full_list.html')}"
    dashboard = open(filename, 'w')
    dashboard.write("<html><head></head><body>" + "\n")
    include_plotlyjs = True

    for fig in fig_list:
        inner_html = fig.to_html(include_plotlyjs = include_plotlyjs).split('<body>')[1].split('</body>')[0]
        dashboard.write(inner_html)
        include_plotlyjs = False
    dashboard.write("</body></html>" + "\n")
Related