UK map - google maps

louiswatson
louiswatson Member
in Cards, Dashboards, Stories
UKMap.png

Hi, I have a UK map which uses lat/long for the dots. I'm looking to use streetviews as that is our main way of identifying good sites remotely. Not all sites have streetview URL's so I can't rely on this.

I was wondering if there is a google maps overlay or DDXBricks that can help me here?

Tagged:

Best Answer

  • ColemenWilson
    ColemenWilson Coach
    edited February 2024 Answer ✓

    You could use Google MyMaps and create a map, then embed it using the HTML Easy DDX brick. Search in the Appstore for HTML Easy:

    Screenshot 2024-02-16 at 8.43.47 AM.png

    Just copy the embed code from Google MyMaps and then paste it in the HTML section in the DDX brick.

    I spent alot of time working on dynamic sizing, here is the code to save you time: 

    <!DOCTYPE html>
<html>
<head>
    <title>Dynamic Iframe - HTML/CSS Only</title>
    <style>
        body, html {
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
        }
        #dynamicIframe {
            width: 100vw;
            height: 100vh;
            object-fit: fill;
        }
    </style>
</head>
<body>
    <iframe id="dynamicIframe" src="insert the url here" frameborder="0"></iframe>
</body>
</html>

    If I solved your problem, please select "yes" above

Answers

  • ColemenWilson
    ColemenWilson Coach
    edited February 2024 Answer ✓

    You could use Google MyMaps and create a map, then embed it using the HTML Easy DDX brick. Search in the Appstore for HTML Easy:

    Screenshot 2024-02-16 at 8.43.47 AM.png

    Just copy the embed code from Google MyMaps and then paste it in the HTML section in the DDX brick.

    I spent alot of time working on dynamic sizing, here is the code to save you time: 

    <!DOCTYPE html>
<html>
<head>
    <title>Dynamic Iframe - HTML/CSS Only</title>
    <style>
        body, html {
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
        }
        #dynamicIframe {
            width: 100vw;
            height: 100vh;
            object-fit: fill;
        }
    </style>
</head>
<body>
    <iframe id="dynamicIframe" src="insert the url here" frameborder="0"></iframe>
</body>
</html>

    If I solved your problem, please select "yes" above

  • louiswatson
    louiswatson Member

    Thankyou! This is super helpful. Do you know if there is a way to get the orange man to appear on Google? This is all we need to get the streetview problem sorted. Cheers

  • ColemenWilson
    ColemenWilson Coach

    I don't. That may be a question for the Google community forums 😄

    If I solved your problem, please select "yes" above

Categories