Google Maps Corner Radius

Does anyone know a solution to make the Google Maps feature have a corner radius? It is throwing off my design and would really help - thank you :pray:

Instead of using the Google Map element, you can embed a Google Map in an HtmlComponent and add the border-radius property to the script.

Use the Google Maps example. The first line in the script , should be modified like this:

<div id="map" style="height: 100%; width: 100%;border-radius: 10px;" />

You will need to pass the location to the script, but the map border will be curved, and you will have many more map and design options available.

Keep in mind that you will need an API key from Google.

Thank you so much Yisrael, I’ll try this later and I’ll let you know how I get on! Have a great day :blush:

1 Like