How to use Google Map API for Maker Lat and Long

lilybluecat · 2013-01-29, 12:37 PM

How to use Google Map API for Maker Lat and Long!!

1st you need to put this code in to your page

Code:

<script type="text/javascript" src=""></script> 
<script type="text/javascript"> 

      var map = null;
      var marker = null;
      var defaultLat = 13.75072;
      var defaultLng = 100.61004;
      var infowindow = new google.maps.InfoWindow(
      {  
           size: new google.maps.Size(150,50)
       });


function createMarker(latlng, name, html) {

    var contentString = html;
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        zIndex: Math.round(latlng.lat()*-100000)<<5
        });

    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(contentString); 
        infowindow.open(map,marker);
        });
    google.maps.event.trigger(marker, 'click');    
    return marker;
}

 

function initialize() {
  // create the map
  var myOptions = {
    zoom: 10,
    center: new google.maps.LatLng(defaultLat,defaultLng),
    mapTypeControl: true,
    mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    navigationControl: true,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  map = new google.maps.Map(document.getElementById("map_canvas"),
                                myOptions);
 
  google.maps.event.addListener(map, 'click', function() {
        infowindow.close();
        });

  google.maps.event.addListener(map, 'click', function(event) {
	//call function to create marker
         if (marker) {
            marker.setMap(null);
            marker = null;
         }
	 marker = createMarker(event.latLng, "name", "<b>Location</b><br>"+event.latLng);
  });

}
</script>

in scr="" put this with "http"+"://"+"maps.google.com/maps/api/js?sensor=false"

2nd In BODY tag put even onload and call initialize() function

HTML Code:

<body onload="initialize()">

3rd put this map object where do you want to place it

HTML Code:

<div id="map_canvas" style="width: 600px; height: 450px;"></div>

Finish

so easy right?

if you want to get lat and long to insert into your database latlng

use js script like this with variable latlng

latlng.lat() or latlng.lng()

Thanks for reading. Sorry for bad english. I hope you dont mind.

Any question post it!! I'll answer as soon as possible.

Garoet · 2013-12-28, 09:59 AM

Hei thx for the tutorial

Dou you know how to use google api for distance ? i need one distance nearest (i don't need alternative distance nearest)

Thread: How to use Google Map API for Maker Lat and Long

Thread Tools

Display

How to use Google Map API for Maker Lat and Long

The Following User Says Thank You to lilybluecat For This Useful Post:

Similar Threads

[Tutorial] How to protect Rpg Maker [XP/VX/VXA] before Cheat Engine

[JS] Remove tracking and instant preview from Google

Having a Long Pet name

Agbot Script Maker

Posting Permissions