How do I embed Google Maps url to website using html? [closed]

Question

I have this Google Maps url I tried to embed using iframe to my website but it's not working

 <iframe id="iframeid"
      width="450"
      height="250"
   style="border:0"
src="https://www.google.com/maps/dir/?api=1&origin=Space+Needle+Seattle+WA&destination=Pike+Place+Market+Seattle+WA&travelmode=bicycling"
  ></iframe>

How do I embed?

Answer 1

Here is one of the easiest ways of embedding Google Maps using html:

<iframe width="100%" height="600" src="https://maps.google.com/maps?width=100%&amp;height=600&amp;hl=en&amp;coord=52.70967533219885, -8.020019531250002&amp;q=1%20Grafton%20Street%2C%20Dublin%2C%20Ireland&amp;ie=UTF8&amp;t=&amp;z=14&amp;iwloc=B&amp;output=embed" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe><br />

You have to change the following:

1. width= (width of iframe)
2. height= (height of iframe)
3. coord= (cordinates of the address)
4. q= (address)
5. z= (zoom level)

Answer 2

It looks like all the Google Earth maps require a paid API KEY to use. However, I was able to create the embedded maps I was looking for by

1. Using Google earth to create any overlay layers or markers and saving them as kmz files.
2. Going to maps.google.com and creating my own map

• Go to Menu
• Select "Your Places"
• Select the "MAPS" tab option
• Click 'SEE ALL YOUR MAPS'

3. Create a new map. Add desired layers.
4. Click on the 3 dots, Embed the maps and provides the base code to copy to your html.
5. Your can adjust your view by adding '&' with the commands that Syfer listed above.

I was able to embed multiple maps on the page, and they load up with the same view that you select in the My maps module on Google Maps.