Javascript 谷歌地图-地图未加载_Javascript_Google Maps_Google Maps Api 3_Google Maps Markers

Javascript 谷歌地图-地图未加载

javascript google-maps google-maps-api-3

Javascript 谷歌地图-地图未加载,javascript,google-maps,google-maps-api-3,google-maps-markers,Javascript,Google Maps,Google Maps Api 3,Google Maps Markers,我正在尝试使用以下代码创建映射并加载.kmz文件： <!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta charset="utf-8"> <style type ="text/css"> html, body, #map-canvas { height: 100%; m

我正在尝试使用以下代码创建映射并加载.kmz文件：

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta charset="utf-8">
<style type ="text/css"> html, body, #map-canvas { height: 100%; margin: 0px; padding: 0px}</style>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=visualization&key=mykey"></script>
<script type="text/javascript">
  function initialize() {
    var myOptions = {
      center: new google.maps.LatLng(58.33, -98.52),
      zoom: 11,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    var kmzLayer = new google.maps.KmlLayer('link_to_kmz_file');
    kmzLayer.setMap(map);
  }
</script>

</head
<body>
<div id="map_canvas"> </div>
</body
</html>


html，正文，#映射画布{高度：100%；边距：0px；填充：0px}
函数初始化（）{
变量myOptions={
中心：新google.maps.LatLng（58.33，-98.52），
缩放：11，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
var map=new google.maps.map（document.getElementById（“map_canvas”），myOptions）；
var kmzLayer=new google.maps.KmlLayer（'link_to_kmz_file'）；
kmzLayer.setMap（map）；
}
您没有在任何地方调用initialize（）
，只是声明了它。如果要在body loaded时调用它，请将其添加到body onload
<body onload="initialize()">



此外，您的结束正文标记不完整
</body>



还有你的头牌
</head>

您没有在任何地方调用initialize（）
，只是声明了它。如果要在body loaded时调用它，请将其添加到body onload
<body onload="initialize()">



此外，您的结束正文标记不完整
</body>



还有你的头牌
</head>


试试这个
google.maps.event.addDomListener（窗口“加载”，初始化）试试这个
google.maps.event.addDomListener（窗口“加载”，初始化）
在HTML中，您正在使用：
<div id="map_canvas"></div>

问题：地图画布
≠ <代码>地图>画布

因为地图需要显示一个高度，所以在更正CSS之前，地图不会显示，如下所示：
#map_canvas {
    ...
}


+您需要更正结束标记
和
标记

+您需要调用initialize（）
函数
将以下内容添加到javascript中：
google.maps.event.addDomListener(window, 'load', initialize);

在HTML中，您正在使用：
<div id="map_canvas"></div>

问题：地图画布
≠ <代码>地图>画布

因为地图需要显示一个高度，所以在更正CSS之前，地图不会显示，如下所示：
#map_canvas {
    ...
}


+您需要更正结束标记
和
标记

+您需要调用initialize（）
函数
将以下内容添加到javascript中：
google.maps.event.addDomListener(window, 'load', initialize);

在函数后面添加如下内容
`<script type="text/javascript">
  function initialize() {
    var myOptions = {
      center: new google.maps.LatLng(58.33, -98.52),
      zoom: 11,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    var kmzLayer = new google.maps.KmlLayer('link_to_kmz_file');
    kmzLayer.setMap(map);
  }
  google.maps.event.addDomListener(window, 'load', initialize);
</script>`

`
函数初始化（）{
变量myOptions={
中心：新google.maps.LatLng（58.33，-98.52），
缩放：11，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
var map=new google.maps.map（document.getElementById（“map_canvas”），myOptions）；
var kmzLayer=new google.maps.KmlLayer（'link_to_kmz_file'）；
kmzLayer.setMap（map）；
}
google.maps.event.addDomListener（窗口“加载”，初始化）；
`
像这样在函数后添加
`<script type="text/javascript">
  function initialize() {
    var myOptions = {
      center: new google.maps.LatLng(58.33, -98.52),
      zoom: 11,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    var kmzLayer = new google.maps.KmlLayer('link_to_kmz_file');
    kmzLayer.setMap(map);
  }
  google.maps.event.addDomListener(window, 'load', initialize);
</script>`

`
函数初始化（）{
变量myOptions={
中心：新google.maps.LatLng（58.33，-98.52），
缩放：11，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
var map=new google.maps.map（document.getElementById（“map_canvas”），myOptions）；
var kmzLayer=new google.maps.KmlLayer（'link_to_kmz_file'）；
kmzLayer.setMap（map）；
}
google.maps.event.addDomListener（窗口“加载”，初始化）；
`
您能在brwser调试工具中看到对KML的成功请求\响应吗？您在哪里调用initialize（）
？问题是什么？请提供一个演示该问题的示例。您能在brwser调试工具中看到对KML的成功请求\响应吗？您在哪里调用initialize（）
？请提供一个演示该问题的示例。这看起来可能是解决方案-如果它能向原始海报解释为什么这会起作用，或者他们应该在哪里添加它，我将是一个更好的答案。感谢您的回答，但是地图没有再次加载。这看起来可能是解决方案-如果它能向原始海报解释为什么这会起作用，或者他们应该在哪里添加这一点，我会是一个更好的答案。谢谢回答，但地图没有再次加载。谢谢回答，但地图没有再次加载。谢谢回答，但地图不会再次加载。