我的地理位置googlemap不工作

我想開發一個混合應用程序使用jQuery手機和phonegap，我想實現一個googlemap與地理定位支持.for我已經做了一些編碼，但運行應用程序時，它只是給我是一個ajax加載程序，它不停止，任何人都可以幫助我找到錯誤..我嘗試了一些jQuery移動演示，但沒有一個正常工作。得到下述我的地理位置googlemap不工作

<!doctype html> 
<html lang="en"> 
    <head> 
     <title> Google maps </title> 
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" /> 
     <style> 
#content { 
    padding: 0; 
    position : absolute; 
    top : 0; 
    right : 0; 
    bottom : 0; 
    left : 0;  
} 
</style> 
     <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
     <script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script> 
     <script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3&sensor=true&language=en"> </script> 
     <script type="text/javascript" src="http://jquery-ui-map.googlecode.com/svn/trunk/ui/min/jquery.ui.map.min.js"></script> 

<script type="text/javascript"> 

      var mumbai = new google.maps.LatLng(19.075984,72.877656), 
       mobileDemo = { 'center': '19.075984,72.877656', 'zoom': 15 }, 
       cityList = [ 
        ['Bank ATM CST Road', 19.075984,72.877656, 1], 
        ['Bank ATM Air India Road', 19.078318,72.877024, 2], 
       ['Bank ATM Lal Bahadur Sasthri Road', 19.069236,72.875278, 3] 
          ]; 

      function initialize() 
      { 
       $('#map_canvas').gmap({ 'center': mobileDemo.center, 'zoom': mobileDemo.zoom, 'disableDefaultUI':false }); 
      //addMarkers(); 
     getcurrentposition(); 
      } 

      function addMarkers() 
      { 
       for (var i = 0; i < cityList.length; i++) 
       { 
        var $marker = $('#map_canvas').gmap('addMarker', {id: i, 'position': new google.maps.LatLng(cityList[i][1], cityList[i][2],cityList[i][3]),title: cityList[i][0]}); 
        $marker.click(function() { 
         $('#map_canvas').gmap('openInfoWindow', {'content': cityList[this.id][0]}, this); 
        }); 
       } 
      } 

      $(document).on("pageinit", "#basic-map", function() { 
       initialize(); 
      }); 

      /* $(document).on('click', '.add-markers', function(e) { 
       e.preventDefault(); 
       addMarkers(); 
      }); */ 

      function getcurrentposition() 
      { 
       $('#map_canvas').gmap('getCurrentPosition', function(position, status) { 
        if (status === 'OK') { 
         var clientPosition = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 
         $('#map_canvas').gmap('addMarker', {'position': clientPosition, 'bounds': true}); 
         $('#map_canvas').gmap('addShape', 'Circle', { 
          'strokeWeight': 0, 
          'fillColor': "#008595", 
          'fillOpacity': 0.25, 
          'center': clientPosition, 
          'radius': 15, 
          'clickable': false 
         }); 
        } 
       }); 

      } 
     </script> 
    </head> 
    <body> 
     <div id="basic-map" data-role="page"> 

      <div data-role="content"> 
       <div class="ui-bar-c ui-corner-all ui-shadow" > 
        <div id="map_canvas" style="height:500px"></div> 
       </div> 

      </div> 
     </div>  
    </body> 
</html>

logcat的

04-04 04:53:07.952: D/CordovaLog(1665): Uncaught TypeError: Cannot call method 'apply' of undefined 
04-04 04:53:07.952: I/chromium(1665): [INFO:CONSOLE(1)] "Uncaught TypeError: Cannot call method 'apply' of undefined", source: file:///android_asset/www/my_current_location.html (1) 
04-04 04:53:08.182: D/Cordova(1665): onPageFinished(file:///android_asset/www/my_current_location.html) 
04-04 04:53:08.182: D/Cordova(1665): Trying to fire onNativeReady 
04-04 04:53:08.202: D/DroidGap(1665): onMessage(onNativeReady,null) 
04-04 04:53:08.202: D/DroidGap(1665): onMessage(onPageFinished,file:///android_asset/www/my_current_location.html)

來源

2014-04-04 Wolverine

你檢查JavaScript控制檯？任何錯誤？ – davids

我檢查了我的logcat ...我在Eclipse中開發..看到編輯 – Wolverine

該消息'未捕獲的TypeError：無法調用未定義的'apply'方法正在調用函數getcurrentposition（）'後啓動。所以Dr.Molle是對的。 –

jquery.ui.map我的代碼沒有一個方法getCurrentPosition，你必須實現它自己。

爲例見http://code.google.com/p/jquery-ui-map/wiki/Examples#Example_get_user_position

<編輯>

鏈接的例子似乎是錯誤的，至少它是錯的這個版本jquery.ui.map的

用途：

(function($) { 

    $.extend($.ui.gmap.prototype, { 

      /** 
      * Gets the current position 
      * @a: function(status, position) 
      * @b:object, see https://developer.mozilla.org/en/XPCOM_Interface_Reference/nsIDOMGeoPositionOptions 
      */ 
      getCurrentPosition: function(callback, geoPositionOptions) { 
     if (navigator.geolocation) { 
      navigator.geolocation.getCurrentPosition ( 
       function(result) { 
        callback(result, 'OK'); 
       }, 
       function(error) { 
        callback(null, error); 
       }, 
       geoPositionOptions 
      ); 
     } else { 
      callback(null, 'NOT_SUPPORTED'); 
     } 
    } 

    }); 

    } (jQuery));

但是你通過韋達的建議

另外也可以加載現有jquery.ui.map.extensions.js： 您還必須包括http://jquery-ui-map.googlecode.com/svn/trunk/ui/jquery.ui.map.overlays.js，這將實行addShape - 方法

演示：http://jsfiddle.net/doktormolle/rd4Xt/ < /編輯>

來源

2014-04-04 09:35:26

我試過鏈接中的代碼..我創建了jquery.ui.map.extensions.js和jquery.ui方法。 map.extensions.min.js ..但現在沒有ajax加載程序，什麼也沒有顯示 – Wolverine

看到我編輯的答案 –

完美！這是工作感謝很多朋友:) – Wolverine

添加此JavaScript文件也..

<script type="text/javascript" src="http://jquery-ui-map.googlecode.com/svn/trunk/ui/jquery.ui.map.extensions.js"></script>

來源

2014-04-04 11:13:26 Ved

我已經補充說..但沒有發生。 – Wolverine

什麼都沒有發生？ – Ved

我越來越空框架。 – Wolverine

我的地理位置googlemap不工作

回答

相關問題