JavaScript get user location

摘要:JavaScript get geoLocation

要透過 JavaScript得知使用者的所在位置有幾種方法:

  1. html5 制定的 geoloaction標準
  2. google gears ← 但因為 html5產生而宣布不再更新
  3. google loader 跟 google gears得到的結果差不多

但是…通常都…不準。對到的位置感覺是中華電信機房XD,猜測原理是透過 ip去查表對應位置。

DEMO:

程式連結:http://jsfiddle.net/

程式片段:



要用 google loader得自行申請一組 key

google.load("maps", "2");
//google.load("jquery", "1.4");
google.setOnLoadCallback(function() {
    var gmap = google.maps,
        myLatlng = new gmap.LatLng(25.019868829517605, 121.4660926273376),
        map = new gmap.Map(document.getElementById("map"));

    function addMarker(lat, lng, msg) {
        var latlng = new gmap.LatLng(lat, lng);
        var marker = new gmap.Marker(latlng);
        gmap.Event.addListener(marker, "click", function() {
            marker.openInfoWindowHtml(msg);
        });
        map.addOverlay(marker);
        return latlng;
    };

    var loaderLocation = google.loader.ClientLocation; // location from google loader
    myLatlng = addMarker(loaderLocation.latitude, loaderLocation.longitude, "from google loader.");

    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(position) {// location from html5 geoLoaction
            addMarker(position.coords.latitude, position.coords.longitude, "from borwser."); 
        }, function() {
            //handleNoGeolocation
        });
    }

    map.addControl(new gmap.LargeMapControl());
    map.addControl(new gmap.MapTypeControl());
    map.setCenter(myLatlng);
    map.setZoom(15);
});

update: 2011/04/19 18:13 下午測兩個都在內湖,發表文章之後 google loader跑到三重…XD