I have a website that showcases outdoor activities in my region. On each activity page (dynamic pages linked to a dataset), I have an HTML element that displays a map (from my profile on the Garmin website). I have linked the HTML element to my dataset (a ‘url’ field type) using the following code:
$w.onReady(function () {
$w('#dynamicDataset').onReady( () => {
const itemUrl = $w('#dynamicDataset').getCurrentItem().url;
$w('#garminhtml1').src = itemUrl;
} );
} );
I know the code works, as the maps loaded perfectly when I launched the site a few weeks ago. However, now the map does not load properly and all the user sees is a grey box or a thin grey bar (see this page for an example - HTML component is towards the bottom of the page - https://www.looseoutdoors.com/activities-search/boardwalk-view-of-mount-coolum).
Does anyone have any insight into what my problem is? I have not edited the code in any way since launching the site, the HTML that I link too loads fine if copied and pasted into the browser, and it is an HTTPS protocol, so I have troubleshooted those issues already.
Is it a timing issue, with the Garmin information loading too quickly/too slowly and getting lost as my dynamic page loads? Is there better/more efficient code that I code use to achieve my aims here?
This is a really crucial bit of info on my activity pages so any assistance or advice to resolve this would be so greatly appreciated!
Thanks is advance 