Why is my plotly offline not being embedded in a dominate page?

I am creating a map with plotly.express and creating a html page with dominate
I have not had any problem with the dominate part and I can create a separate html page with the map part. My problem is that when I try to take the map into a html code and put it inside dominate, it does not show. The map is there (I can see it in the html) but it does not show

so I have something like

import dominate
from dominate.tags import *
from dominate.util import raw
import plotly.express as px
import plotly.offline as pyo
import pandas as pd

#Here get some dataframe with Latitude and Longitude and ImageNo data
can_whole_df=get_some_df()

fig = px.scatter_mapbox(can_whole_df, lat="Latitude", lon="Longitude",
                            zoom=10,
                            text = 'ImageNo'
                        )
fig.update_layout(mapbox_style="open-street-map", margin={"r":0,"t":0,"l":0,"b":0})

fig.write_html("debugmap.html")  #<---THIS WORKS. (I can see the map separatedly)

#Here I take the map and put it in some code to embed it in dominate

the_map= pyo.plot(fig, include_plotlyjs=False, output_type='div')

doc=dominate.document(title="some map")
with doc.head:
    link(rel='stylesheet', href='style.css')

with doc:
    h1("The Map in all its glory!")
    # with div(id='map'):
    #     p('Here goes a map')
    #     raw(the_map)
    raw(the_map)
print(doc)

As a result I could see that the map in its own file (debugmap.html) but I cannot see it when I save the dominate output into a html page.

Take into account that the html code is there, I just cannot see it.

What am I doing wrong?