Embed Google map into my page

Discussion in 'PHP' started by Lotos1, Mar 15, 2010.

  1. #1
    I'm using PHP and want to embed a small Google map on one of my pages using a full address. So I have the address of a location, and want to use this address to create the map. I do not know any coordinates of the location like the latitude and longitude; only the full address is known. How can I do this?
     
    Lotos1, Mar 15, 2010 IP
  2. ThomasTwen

    ThomasTwen Peon

    Messages:
    113
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #2
    
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=abcdefg&sensor=true_or_false"
                type="text/javascript"></script>
    
    <script type="text/javascript">
    var map = null;
    var geocoder = null;
    
    function initialize() {
      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(37.4419, -122.1419), 13);
        geocoder = new GClientGeocoder();
        showAddress("<?php echo "white house"; ?>");
      }
    }
    
    function showAddress(address) {
      if (geocoder) {
        geocoder.getLatLng(
          address,
          function(point) {
            if (!point) {
              alert(address + " not found");
            } else {
              map.setCenter(point, 13);
              var marker = new GMarker(point);
              map.addOverlay(marker);
              marker.openInfoWindowHtml(address);
            }
          }
        );
      }
    }
    initialize();
    </script>
    <div id="map_canvas"></div>
    
    Code (markup):

    Please remember to insert your Google Maps API Key in the script src tag.
     
    ThomasTwen, Mar 15, 2010 IP
  3. Lotos1

    Lotos1 Peon

    Messages:
    454
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #3
    How can I get the Google Maps API Key when it is saying to enter website's URL at which it will be used? I am still developing the website and have not registered a domain name at the moment. Do I just enter: http://localhost/ for the URL since it is hosted on my development machine or what can I do to make it work?
     
    Lotos1, Mar 15, 2010 IP
  4. yoursanjay

    yoursanjay Member

    Messages:
    42
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    41
    #4
    Yes, for the time being you can use http://localhost/yourprojectname for getting the API from google. After completion of the project and geeting the live domain, get the actual API using your original URL and then replace the new API key to the old one.
     
    yoursanjay, Mar 15, 2010 IP
  5. Lotos1

    Lotos1 Peon

    Messages:
    454
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #5
    I got a new Maps API key from Google and added it to the script above, but my <div> is empty. I entered http://localhost when they asked me for the website URL. No map is loaded at all. I created the div <div id="map_canvas"></div> in the <body> of my page but nothing is loaded in it. The script above should load and initial map using 37.4419, -122.1419 as coordinates, but nothing gets displayed. Is the script above correct or could it be that the key I got from Google is not good?

    I found the error. The script pasted above was calling initialize() without assigning it to body onload.
     
    Last edited: Mar 16, 2010
    Lotos1, Mar 16, 2010 IP
  6. anu02

    anu02 Member

    Messages:
    19
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    36
    #6
    anu02, Mar 20, 2010 IP
  7. roopajyothi

    roopajyothi Active Member

    Messages:
    1,302
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    80
    #7
    Yeah thats right!
    It does needs a key now!
    All are server based authentication!
     
    roopajyothi, May 17, 2010 IP