adding a google map to my website

The place to discuss anything to do with computers, software, hardware, no matter how basic or technical. We all use this stuff, but we don't always understand it!
Post Reply
User avatar
greenfrog
Posts: 885
Joined: Sun May 21, 2006 9:08 pm
Location: Paris, France

adding a google map to my website

Post by greenfrog »

Hi all,

I'm having trouble adding my google map to my website.

I've created a map under MyMaps; I've generated the API key; I've cut and pasted their example under google api documentation; I've replaced the key example with my key - and now I can't find out how to insert my map details into the code. I keep getting their Palo Alto location example.

The help docs just wander off into elaborate explanation of all the fab things google can do but I just need that basic bit of info.

I've spent hours combing the docs and the help groups - who all seem to be developers with loads of javascript experience, which I'm not. It's driving me crazy!

If anyone can help, in very simple language please, :? :lol:
I would be very grateful.
Thanks!
Lounging on the lily pad...
Top
User avatar
Angel
Posts: 103
Joined: Wed Jul 12, 2006 11:17 am
Location: Kapparis, Cyprus
Contact:
Contact Angel

Post by Angel »

Hi GF

I'm just playing with maps myself. Have a look at
viewtopic.php?t=4643

I think you need to change the map.setCenter line.

HTH
Top
User avatar
greenfrog
Posts: 885
Joined: Sun May 21, 2006 9:08 pm
Location: Paris, France

Post by greenfrog »

Hi,

Thanks for that.
I checked that thread already but it deals with general maps rather than a saved My Map.

Also, I thought I'd try it as a start so I changed the co-ordinates but nothing happened.
:?

Still confused...
Lounging on the lily pad...
Top
User avatar
Billywiz
Posts: 33
Joined: Thu May 31, 2007 12:41 pm
Location: Murcia, Spain
Contact:
Contact Billywiz

Post by Billywiz »

Hello Greenfrog
This is the code for adding a map

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http&#58;//www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google Maps JavaScript API Example</title>
    <script src="http&#58;//maps.google.com/maps?file=api&v=2&key=YOUR KEY HERE"
      type="text/javascript"></script>
    <script type="text/javascript">
    //<!&#91;CDATA&#91;
    function load&#40;&#41; &#123;
      if &#40;GBrowserIsCompatible&#40;&#41;&#41; &#123;
        var map = new GMap2&#40;document.getElementById&#40;"map"&#41;&#41;;
       var map = new GMap&#40;document.getElementById&#40;"map"&#41;&#41;;map.addControl&#40;new GSmallMapControl&#40;&#41;&#41;;map.addControl&#40;new GMapTypeControl&#40;&#41;&#41;;

        map.setCenter&#40;new GLatLng&#40;35.95694, 14.42306&#41;,13&#41;;
      &#125;
    &#125;
    //&#93;&#93;>
    </script>
  </head>
  <body onload="load&#40;&#41;" onunload="GUnload&#40;&#41;">
    <div id="map" style="width&#58; 500px; height&#58; 300px"></div>
  </body>
where you see 35.95694, 14.42306 change to your Latitude and Longitude centering co-ordinates
Where you see YOUR KEY HERE delete those words and replace with your API key.
Where you see 500px and 300px change to the size you want your map.
You can also change the title line.

Cheers
Top
User avatar
greenfrog
Posts: 885
Joined: Sun May 21, 2006 9:08 pm
Location: Paris, France

Post by greenfrog »

Thanks, Billywiz.

That's solved the general map problem - there was a line of code missing in the example I copied from Google Help!

However, it doesn't help me in inserting the Google map with markers etc that I created using Google Maps. Any idea on how to do that?

Thanks!
Lounging on the lily pad...
Top
User avatar
Billywiz
Posts: 33
Joined: Thu May 31, 2007 12:41 pm
Location: Murcia, Spain
Contact:
Contact Billywiz

Post by Billywiz »

Greenfrog, the maps you make in My maps are completely different to the Map with the API key, you can add various icons and controls etc to the map but you will need to know some coding to do this and all is explained here http://www.google.com/apis/maps/documen ... to_the_Map
What you can do in My Maps is create a link to the map you made by clicking on the "Link to this page" tab just above the map and copying the link that appears and putting this onto your webpage. Hope this helps

Cheers
Top
User avatar
greenfrog
Posts: 885
Joined: Sun May 21, 2006 9:08 pm
Location: Paris, France

Post by greenfrog »

Ah!! That would explain it...
Seems a shame that I can't add MyMap to my site... the google maps site does rather imply one can.
Oh well.
At least I now have a map up there - thank you so much!!
Lounging on the lily pad...
Top
Post Reply

Return to “The Workshop”