Is there a way to plot multiple plotly express graphs onto the same html page, without using subplots? Plotly Python 3

Question

I'm working on displaying 2 plots, completely unique, using a lot of graph formatting within Plotly express.

At the moment, they are displaying as 2 separate html files - 2 windows in a browser. I'd like to combine them to be in a single file automatically, without having to combine the html files. I've tried using subplots, however, the graphs are too complex for the subplot functionality and formatting options.

Is there a way to do this within Plotly, or Python?

Have tried merging html files into one master file within python script, perhaps there is a way to position the plots in the script rather than by hand by editing html code?

Answer 1

You can achieve this type of html using jinja with plotly.

template.html

{{ table1 }}
{{ table2 }}

main.py

from jinja2 import Environment, FileSystemLoader
import plotly.express as px

fig1 = px.bar(...
fig2 = px.bar(...

env = Environment(
    loader=FileSystemLoader(
        'path/to/template/file/folder'
    )
)
template = env.get_template('template.html')
html = template.render({'table1': fig1.to_html(), 'table2': fig2.to_html()})
with open('out_filepath.html', 'w', encoding="utf-8") as f:
    f.write(html)

The above code should create an html file called out_filepath.html with both figures in it.