Google Maps API v3 - TypeError：表達式結果'google.maps.LatLng'[undefined]不是構造函數

我創建了一個靜態html頁面，用於顯示數據中的多個位置。我剛纔複製的樣本之一，並且向後工作，但我發現在Safari中檢查以下錯誤：Google Maps API v3 - TypeError：表達式結果'google.maps.LatLng'[undefined]不是構造函數

main.js:1SyntaxError: Parse error 
sample.htm:10TypeError: Result of expression 'google.maps.LatLng' [undefined] is not a constructor.

這裏是我的html代碼：

<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
<title>Multi Markers Sample via Google Maps</title> 
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript"> 
function initialize() { 
var myLatlng = new google.maps.LatLng(-30.2965590,153.1152650); 
var myLatlng1 = new google.maps.LatLng(-30.2956470,153.1123707); 
var myLatlng2 = new google.maps.LatLng(-30.2864430,153.1360230); 
var myOptions = { 
zoom: 13, 
center: myLatlng, 
mapTypeId: google.maps.MapTypeId.ROADMAP 
} 
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
var marker = new google.maps.Marker({ 
position: myLatlng, 
map: map, 
icon: 'http://www.google.com/intl/en_us/mapfiles/ms/icons/blue-dot.png', 
title:"Original Location"  }); 
var marker = new google.maps.Marker({ 
position: myLatlng1, 
map: map, 
title:"Tom Cruise"  }); 
var marker = new google.maps.Marker({ 
position: myLatlng2, 
map: map, 
title:"Lady Gaga"  }); 
} 
</script> 
</head> 
<body onLoad="initialize()"> 
<div id="map_canvas"></div> 
</body> 
</html>

我不知道我在這裏做的錯誤 - 它實際上在Windows上的IE v8中工作，但不在Safari中，我需要爲它們工作。

來源

2011-07-05 Steve Kemp

將回調函數添加到您的Google地圖請求中。它會在Google加載所需的所有內容後執行。

http://maps.google.com/maps/api/js?sensor=false&callback=initialize

來源

2011-12-02 18:41:30 ThatGuy

+1生命的救星隊友使用此代碼;這個答案應該被接受！ – trojanfoe

輝煌.. +1真的:) – KAsh

閱讀doco或訪問StackOverflow。謝謝！ – Greg0ry

喜請使用JQuery `

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
<title>Multi Markers Sample via Google Maps</title> 
    <script src="js/jquery-1.10.2.min.js"></script> 

<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
     <style> 
     #map_canvas { 
      height: 500px; 
      width: 100%; 
     } 
    </style> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     var myLatlng = new google.maps.LatLng(-30.2965590, 153.1152650); 
     var myLatlng1 = new google.maps.LatLng(-30.2956470, 153.1123707); 
     var myLatlng2 = new google.maps.LatLng(-30.2864430, 153.1360230); 
     var myOptions = { 
      zoom: 13, 
      center: myLatlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     } 
     var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
     var marker = new google.maps.Marker({ 
      position: myLatlng, 
      map: map, 
      icon: 'http://www.google.com/intl/en_us/mapfiles/ms/icons/blue-dot.png', 
      title: "Original Location" 
     }); 
     var marker = new google.maps.Marker({ 
      position: myLatlng1, 
      map: map, 
      title: "Tom Cruise" 
     }); 
     var marker = new google.maps.Marker({ 
      position: myLatlng2, 
      map: map, 
      title: "Lady Gaga" 
     }); 
    }); 
</script> 
</head> 
<body > 
<div id="map_canvas"></div> 
</body> 
</html>`

來源

2013-12-25 16:14:46

Google Maps API v3 - TypeError：表達式結果'google.maps.LatLng'[undefined]不是構造函數

回答

相關問題