谷歌地圖描繪示例中的jsfiddle工作正常，但不是在HTML

-4

這是的jsfiddle鏈接：http://jsfiddle.net/J5zMg/21/谷歌地圖描繪示例中的jsfiddle工作正常，但不是在HTML

這是我嘗試運行HTML：

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Documento sin título</title> 
<style> 
    #map { 
     height: 420px; 
     width:600px; 
    } 
</style> 
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=drawing&extension=.js"></script> 
<script type="text/javascript">//<![CDATA[ 
$(window).load(function(){ 
var mapOptions = { 
    center: new google.maps.LatLng(-34.397, 150.644), 
    zoom: 8, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}; 

var map = new google.maps.Map(document.getElementById('map'), 
mapOptions); 

var drawingManager = new google.maps.drawing.DrawingManager({ 
    drawingControlOptions: { 
     position: google.maps.ControlPosition.BOTTOM_LEFT, 
     drawingModes: [ 
     google.maps.drawing.OverlayType.CIRCLE, 
     google.maps.drawing.OverlayType.RECTANGLE, 
     google.maps.drawing.OverlayType.POLYGON] 
    } 
}); 

google.maps.event.addListener(drawingManager, 'markercomplete', function (marker) { 
    var position = marker.getPosition().toUrlValue(2); 
    $('#marker-position').append(position + '<br>'); 
}); 


google.maps.event.addListener(drawingManager, 'circlecomplete', function (circle) { 
    var position = circle.getCenter(); 
    var rad = circle.getRadius(); 
    $('#marker-position').append('Centre => '+position +'<br>Radius =>' + rad+'<br>'); 
}); 

google.maps.event.addListener(drawingManager, 'polygoncomplete', function (polygon) { 
    var position = polygon.getPath(); 
    $('#marker-position').append('Polygon => '+position.getArray()); 
}); 

google.maps.event.addListener(drawingManager, 'polylinecomplete', function (polyline) { 
    var position = polyline.getPath(); 
    $('#marker-position').append('polyline => '+position.getArray()); 
}); 

google.maps.event.addListener(drawingManager, 'rectanglecomplete', function (rectangle) { 
    var position = rectangle.getBounds(); 
    $('#marker-position').append('rectangle => '+position); 
}); 

drawingManager.setMap(map); 
});//]]> 
</script> 

<!--<script type="text/javascript" src="./js/poly2.js"></script>--> 
</head> 
<body> 
    <div id="map"></div> 
    <div id="marker-position"></div> 
</body> 
</html>

聽衆事件從未在執行我的HTML，但在jsfiddle工作正常，我檢查jsfiddle中的外部引用，他們是正確的。

我添加了選項，如矩形選項，可拖動，可編輯等，並在兩個工作正常。

有些東西我沒有考慮，也沒有看到它，任何參考或觸發器，我看到http://jsfiddle.net/J5zMg/21/embedded/result/中的HTML，並且看不到任何區別。

區別在於聽衆的事件，但我不知道如何解決。

任何幫助？

在此先感謝

來源

2015-06-04 Alf

您忘記了包含jQuery腳本標記。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js""></script>

來源

2015-06-04 09:34:16 Zee

是的，現在正在工作 – Alf

谷歌地圖描繪示例中的jsfiddle工作正常，但不是在HTML

回答

相關問題