Show div id="map" from gutenberg

Hello,

I'm trying to insert the map with the listing post in my archive page like this tutorial:
https://metabox.io/display-all-listings-on-a-map/

I have managed to do it by editing the file archive.php and inserting the code:
<div id="map" style="width: 100%; height: 600px"></div>

But it is not really what I need, since I am overriding the layout file from my theme, and I want to put two columns, in the first column the list of posts, and in the second column the map.

To do this, I have created a shortcode that I put in the second column that returns the code for the map to appear:
<div id="map" style="width: 100%; height: 600px"></div>

but the space that the blank map would occupy appears to me and the map does not appear...

For the template i am using gutenberg.

Do you know how I could make the map appear?

Thanks!!