Trouble embeding a Google map

[OBXjuggler]

Hello

having a BAD time making a google map work

i have been trying, no go

found this

Google Cloud Platform

this is basicaly where i first get stuck…

i ask anyone who knows this stuff to reply with everything i need to do to make a google map API work

this FAR out of my comfort zone

i strongly believe this is too much for my curent skill set

i dont get cloud, i dont get Keys

i am completely lost

i tried different youtubes and another online resource, no go

is making gogle maps with API easy to do?

am i missing something?

i have done my research and remain intimadated

dumb it down for me

please see https://forallthetime.com/BI9/location.html there is a google map that seems fully functunal

how can i wrap text around the map?

are APIs necessary to make a google map work?

i came accross a site that provided the HTML and CSS, nothing about keys, clouds…

any help would be appreciated

[SamA74]

@OBXjuggler

are APIs necessary to make a google map work?

It really depend upon what functionality you need from the map.
If you simply want to embed a map with a single marker on a particular place, as in the example you linked, that’s quite simple without needing the API.
(observe the source code of that site)
If you need something more complex, such as multiple map location markers, custom overlays and other custom map features, you will need to use the API.

[PaulOB]

@OBXjuggler

how can i wrap text around the map?

The same way you would with an image or video.

e.g.

.map iframe{
    width:80%;
    height:auto;
    max-width:800px;
    min-width:280px;
    aspect-ratio:16 / 9;
    float:left;
    margin:0 1rem 1rem 0;
}
@media screen and (max-width:800px){
    .map iframe{
        float:none;
        display:block;
        margin:auto;
    }
}

I suggest that on mobile screens you don’t let the map go edge to edge otherwise the user can get trapped inside the scrolling map and not scroll the page unless there is a gap at the side.

[OBXjuggler]

great! thank you!

@SamA74

If you simply want to embed a map with a single marker on a particular place, as in the example you linked, that’s quite simple without needing the API.

so the the example i linked to will work ok?

understanding:

@SamA74

If you need something more complex, such as multiple map location markers, custom overlays and other custom map features, you will need to use the API.

i do not need someting more complex, i do not need multiple map location markers, i do not need custom overlays and other custom map features

again

@SamA74

If you simply want to embed a map with a single marker on a particular place

yes! thats FINE with me!!

no issues with the example i linked, then?

MANY THANKS!!!

[SamA74]

You can get the embed code directly from Google Maps.
Click on a featured place to bring up the info in the side panel.
Click on Share.
In the Share box click “Embed a map”.
Copy the embed code and paste into your HTML page.

[Archibald]

I have switched to using OpenStreetMap to avoid possibly having to pay fees for using Google maps:

OpenStreetMap

And the graphics on OpenStreetMap is much better too!

When viewing a map with OpenStreetMap you can get HTML code to embed via the ‘Share’ button on the right hand side, with the option of including a marker.