2013-04-16 30 views
1

好的,我已經查看了它,只發現了一頁。我的Google地圖JavaScript代碼顯示在桌面瀏覽器上,但不顯示在我的手機瀏覽器上

Google Maps API GeoLocation not working for mobile

我的問題是,我有一些JavaScript代碼調用谷歌地圖API和顯示器就好了,當我用我的桌面上的我的瀏覽器,它查看,我使用的瀏覽器是谷歌鉻,但當我嘗試查看它使用我的Android手機它根本不顯示。我不確定是什麼問題,我已經運行了幾天,但地圖崩潰並停止顯示。從那以後我不得不重新做代碼才能讓它再次顯示。我終於搞定了,但現在我有了這個新問題。這是我正在使用的代碼。

<!DOCTYPE html> 
    <html> 
    <head> 
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
     <link rel="Stylesheet" type="text/css" href="css/drop.css" /> 
     <link rel="Stylesheet" type="text/css" href="css/login.css" /> 
     <script type="text/javascript" src="http://maps.google.com/maps/api/js? sensor=false"></script> 
     <script type="text/javascript"> 
      function getLocation() { 
       if (navigator.geolocation) { 
        navigator.geolocation.getCurrentPosition(getMap, showError); 
       } 
       else { 
        alert("Geolocation is not supported by this browser."); 
       } 
      } 

      function initialize(lat, lon) { 
       pLatitude = lat; 
       pLongitutde = lon; 

      var mapOptions = { 
       center: new google.maps.LatLng(lat, lon), 
       zoom: 14, 
       mapTypeId: google.maps.MapTypeId.ROADMAP, 
       mapTypeControl: true 
      } 

      var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); 
      var marker = new google.maps.Marker({ 
       position: new google.maps.LatLng(lat, lon), 
       map: map, 
       title: "Current Location" 
      }); 
     } 

     function getMap(position) { 
      lat = position.coords.latitude; 
      lon = position.coords.longitude; 

      google.maps.event.addDomListener(window, 'load', initialize(lat, lon)); 
     } 

     function showError(error) { 
      switch (error.code) { 
       case error.PERMISSION_DENIED: 
        alert("User denied the request for Geolocation."); 
        break; 
       case error.POSITION_UNAVAILABLE: 
        alert("Location information is unavailable."); 
        break; 
       case error.TIMEOUT: 
        alert("The request to get user location timed out."); 
        break; 
       case error.UNKNOWN_ERROR: 
        alert("An unkown error occurred."); 
        break; 
     } 
    } 
</script> 
</head> 
<body onload="getLocation()"> 
    <div id="map-canvas"></div> 
</body> 
</html> 
+0

是否還有其他代碼沒有包括在內?例如,何時調用getMap()和getLocation()?另外,你應該調用'initialize()',而不是將它作爲回調函數傳遞給'google.maps.event.addDomListener'。 – Kai

+0

我要加入我所有的代碼。我上次沒有多少運氣。 – RenegadeScar

+0

凱我仍然不確定你的意思是我正在調用initialize()而不是將它作爲回調傳遞給addDomListener。 – RenegadeScar

回答

3

你犯了一些錯誤。我更新了你的代碼,並添加註釋作出解釋:http://jsfiddle.net/cj5xF/1/

還有全屏視圖(移動測試):http://jsfiddle.net/cj5xF/1/embedded/result/

從固定的代碼片段:

// When the page has loaded, call the getLocation function. 
    // Be sure not to use parenthesis after getLocation, or you will 
    // call it, instead of passing a reference to it to be called later (callback) 
    google.maps.event.addDomListener(window, 'load', getLocation); 

這將調用getLocation在頁面加載時起作用。 getLocation函數將執行其地理位置檢查,如果可用,請調用initialize並將其傳入包含座標的position對象。然後initialize將使用這些座標來創建谷歌地圖。

+0

嘿謝謝你的幫助。這使我的代碼更好,並且它的設置更加正確。現在唯一的問題是,地圖仍然不會加載到我的手機上,但其加載對其他人來說很好。現在我只需要弄清楚手機的問題。哦,我什至不能查看你給我的工作代碼的全屏視圖的鏈接。我的電話是問題。 – RenegadeScar

+0

嘿凱感謝一羣幫忙。我終於讓我的地圖顯示在手機的瀏覽器上。經過一段時間的爭鬥後,有了什麼設置和什麼不是,最終確定它是電話重啓。得愛技術。 – RenegadeScar

+0

太棒了,很高興我能幫到你! – Kai

相關問題