[英]How to addShape() on a google map with jquery-ui-map correctly
我使用以下代碼通過使用jquery,jqueryui-map和google maps API向地圖添加形狀
$('#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': false});
$("#map_canvas").gmap("option", "center", clientPosition);
$('#map_canvas').gmap('option', 'zoom', 14);
$('#map_canvas').gmap('addShape', 'Circle', {
'strokeColor': "#008595",
'strokeOpacity': 0.8,
'strokeWeight': 2,
'fillColor': "#008595",
'fillOpacity': 0.35,
'center': clientPosition,
'radius': 50,
'clickable': false });
}
});
我還嘗試在$('#map_canvas')上調用.addShape方法。 但我只得到以下錯誤:
Uncaught TypeError: Cannot call method 'apply' of undefined jquery.ui.map.js:46
$.a.$.fn.(anonymous function) jquery.ui.map.js:46
e.extend.each jquery.min.js:2
e.fn.e.each jquery.min.js:2
$.a.$.fn.(anonymous function) jquery.ui.map.js:40
(anonymous function) :8080:397
$.extend.getCurrentPosition
有誰知道如何解決這個問題? http://jquery-ui-map.googlecode.com/svn/trunk/demos/jquery-google-maps-geolocation.html上的示例由於某種原因而起作用。我只是無法弄清楚實際的差異。也許我現在要失明了;)
謝謝,
拍
有同樣的問題,從未提及的相同文檔產生包括jquery.ui.map.overlays.js
代碼說
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="PATH_TO_PLUGIN/jquery.ui.map.js"></script>
<script type="text/javascript" src="PATH_TO_PLUGIN/jquery.ui.map.extensions.js"></script>
實際上你需要的時候
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="PATH_TO_PLUGIN/jquery.ui.map.js"></script>
<script type="text/javascript" src="PATH_TO_PLUGIN/jquery.ui.map.overlays.js"></script>
事實上,經過測試,它沒有jquery.ui.map.extensions.js
我評論了jquery.ui.map.extensions.js並添加了jquery.ui.map.overlays.js但它沒有幫助
<script type="text/javascript" charset="utf-8" src="js/jquery-1.9.1.min.js"> </script>
<script type="text/javascript" src="js/jquery.ui.map.js"></script>
<!--script type="text/javascript" src="js/jquery.ui.map.extensions.js"></script-->
<script type="text/javascript" src="js/jquery.ui.map.overlays.js"></script>
這導致Object#沒有方法'getCurrentPosition'錯誤。
然后我取消注釋jquery.ui.map.extensions.js然后它對我有用。
<script type="text/javascript" charset="utf-8" src="js/jquery-1.9.1.min.js"> </script>
<script type="text/javascript" src="js/jquery.ui.map.js"></script>
<script type="text/javascript" src="js/jquery.ui.map.extensions.js"></script>
<script type="text/javascript" src="js/jquery.ui.map.overlays.js"></script>
無論如何感謝Moak !! 它確實有幫助。
它必須是這樣的:
<script type="text/javascript" src="jquery/2.1.0/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="jquery-ui-map/3.0-rc/ui/min/jquery.ui.map.min.js"></script>
<script type="text/javascript" src="jquery-ui-map/3.0-rc/ui/jquery.ui.map.extensions.js"></script>
<script type="text/javascript" src="jquery-ui-map/3.0-rc/ui/jquery.ui.map.overlays.js"></script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.