0

我正在尝试将谷歌地图添加到我的网站，我尝试了这个：

 $.getScript("https://maps.googleapis.com/maps/api/js?sensor=false", function () {
     alert("1");          
     var map;
     var myOptions = {
         zoom: 8,
         center: new google.maps.LatLng(-34.397, 150.644),
         mapTypeId: google.maps.MapTypeId.ROADMAP
     };
     alert("2");
     map = new google.maps.Map(document.getElementById("container"), myOptions);
 });

这是行不通的。谁能告诉我为什么？

编辑

脚本加载完美。我知道这是因为alert(1)显示但之后控制没有达到alert(2)。

4

3 回答 3

4 
document.getElementById(id)

什么是id，它是在哪里定义的？

getScript 还用于执行 Ajax 请求，而这并不是您应该执行 Google Maps 的方式。只需以正常方式调用脚本，并有一个在文档就绪时执行的 init 函数。或者更好地使用 Google Maps API 为您提供的 window.load 事件侦听器。

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false" />

<script type="text/javascript">
function init(id) 
     {          
             var map;
             var myOptions = {
                 zoom: 8,
                 center: new google.maps.LatLng(-34.397, 150.644),
                 mapTypeId: google.maps.MapTypeId.ROADMAP
             };
             map = new google.maps.Map(document.getElementById(id), myOptions);
     }

google.maps.event.addDomListener(window, 'load', init('yourDivID'));
</script>
于 2012-06-18T12:09:13.470 回答
1

您必须为此使用异步加载 - https://developers.google.com/maps/documentation/javascript/tutorial#asynch

在当前方法中，脚本执行此操作 -

function getScript(src) {
  document.write('<' + 'script src="' + src + '"' + ' type="text/javascript"><' + '/script>');
}

所以，当你打电话时$.getScript，那将是无效的。并且，google.maps.LatLng变得未定义。

我创建了一个带有异步版本的版本。您可以检查小提琴@ http://jsfiddle.net/rifat/G3yPw/

于 2012-06-18T13:56:28.257 回答
0

你应该看看你的容器 div。

它必须具有指定的宽度和高度。

我曾经把 LatLng 的矫揉造作分开：

     var map;
     var ll = new google.maps.LatLng(-34.397, 150.644);
     var myOptions = {
         zoom: 8,
         center: ll,
         mapTypeId: google.maps.MapTypeId.ROADMAP
     };
     map = new google.maps.Map(document.getElementById("container"), myOptions);
于 2012-06-18T12:12:39.430 回答