Javascript 如何嵌入谷歌地图？

我正在尝试将谷歌地图添加到我的网站，我尝试了以下方法：

 $.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);
 });

这是行不通的。有人能告诉我为什么吗

编辑

脚本加载完美。我之所以知道这一点，是因为显示了

警报（1）

，但之后控件没有到达

警报（2）

什么是id，从哪里定义的

另外，getScript用于处理Ajax请求，这并不是您应该如何处理GoogleMaps。只需以正常方式调用脚本，并使用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>

函数初始化（id）
{          
var映射；
变量myOptions={
缩放：8，
中心：新google.maps.LatLng（-34.397150.644），
mapTypeId:google.maps.mapTypeId.ROADMAP
};
map=new google.maps.map（document.getElementById（id），myOptions）；
}
google.maps.event.addDomListener（窗口'load'，init（'yourDivID'）；

什么是id，从哪里定义的

另外，getScript用于处理Ajax请求，这并不是您应该如何处理GoogleMaps。只需以正常方式调用脚本，并使用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>

函数初始化（id）
{          
var映射；
变量myOptions={
缩放：8，
中心：新google.maps.LatLng（-34.397150.644），
mapTypeId:google.maps.mapTypeId.ROADMAP
};
map=new google.maps.map（document.getElementById（id），myOptions）；
}
google.maps.event.addDomListener（窗口'load'，init（'yourDivID'）；

您应该查看一下您的container div

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

我过去常常把拉丁的做作分开：

     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);

---

你应该看看你的容器分区

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

我过去常常把拉丁的做作分开：

     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);

---

您必须为此使用异步加载-

在当前的方法中，脚本可以这样做-

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

函数getScript（src）{ 文件。写（“”）； } 因此，当您调用

$.getScript

时，它将变为无效。而且，

google.maps.LatLng

变得未定义

---

我已经创建了一个异步版本。您可以检查fiddle@

您必须为此使用异步加载-

在当前的方法中，脚本可以这样做-

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

函数getScript（src）{ 文件。写（“”）； } 因此，当您调用

$.getScript

时，它将变为无效。而且，

google.maps.LatLng

变得未定义

---

我已经创建了一个异步版本。你可以检查小提琴

没有人能告诉你为什么它不工作，因为在你真正告诉我们之前，没有人知道它是如何工作的。你说的“不工作”是什么意思？如果您的意思是没有错误发生，并且它根本没有显示，那么首先我将调查

id

的值，并确保它存在。然后从那里开始。粘贴html代码，id为

id

的元素必须是指定高度和宽度的

div

。现在可能是我的编辑可以清楚地解释我的问题了！如果出现任何意外的脚本错误，是否已使用浏览器调试工具进行检查？如果您使用Chrome/Firefox，例如CTRL+SHIFT+J。也许有些语法不正确。没有人能告诉你为什么它不工作，因为在你真正告诉我们之前，没有人知道它是如何工作的。你说的“不工作”是什么意思？如果您的意思是没有错误发生，并且它根本没有显示，那么首先我将调查

id

的值，并确保它存在。然后从那里开始。粘贴html代码，id为

id

的元素必须是指定高度和宽度的

div

。现在可能是我的编辑可以清楚地解释我的问题了！如果出现任何意外的脚本错误，是否已使用浏览器调试工具进行检查？如果您使用Chrome/Firefox，例如CTRL+SHIFT+J。可能有些语法不正确。@tkone:只是猜测而已。我认为这只是上次编辑之前的一个问题。在这种情况下，作为评论可能更合适？除非偏离了轨道，否则很明显这就是问题的原因。那么它应该是一个明确的答案，而不是一个问题。@tkone:只是猜测而已。我认为这只是上次编辑之前的一个问题。在这种情况下，作为评论可能更合适？除非偏离了轨道，否则很明显这就是问题的原因。那么它应该是一个明确的答案，而不是一个问题。如果您想知道

警报（2）

没有调用的原因，请告诉我。如果您想知道

警报（2）

没有调用的原因，请告诉我。