Question

今天我正在尝试使用一些数据创建谷歌地图，问题是我正在复制/粘贴谷歌地图示例的代码，但什么都没有来......我得到一个空白页面....我疯了吗？你能告诉我发生了什么吗？我正在使用chrome和firefox ..都是空白的。

<!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>Google Maps JavaScript API v3 Example: Polygon Arrays</title>
<link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet"  type="text/css" />
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">

var map;
var infoWindow;

function initialize() {
var myLatLng = new google.maps.LatLng(24.886436490787712, -70.2685546875);
var myOptions = {
  zoom: 5,
  center: myLatLng,
  mapTypeId: google.maps.MapTypeId.TERRAIN
 };

 var bermudaTriangle;

 map = new google.maps.Map(document.getElementById("map_canvas"),
    myOptions);

 var triangleCoords = [
    new google.maps.LatLng(25.774252, -80.190262),
    new google.maps.LatLng(18.466465, -66.118292),
    new google.maps.LatLng(32.321384, -64.75737)
 ];

 bermudaTriangle = new google.maps.Polygon({
  paths: triangleCoords,
  strokeColor: "#FF0000",
  strokeOpacity: 0.8,
  strokeWeight: 3,
  fillColor: "#FF0000",
  fillOpacity: 0.35
 });

 bermudaTriangle.setMap(map);

 // Add a listener for the click event
 google.maps.event.addListener(bermudaTriangle, 'click', showArrays);

 infowindow = new google.maps.InfoWindow();
 }

 function showArrays(event) {

// Since this Polygon only has one path, we can call getPath()
// to return the MVCArray of LatLngs
var vertices = this.getPath();

var contentString = "<b>Bermuda Triangle Polygon</b><br />";
contentString += "Clicked Location: <br />" + event.latLng.lat() + "," + 
event.latLng.lng() + "<br />";

// Iterate over the vertices.
for (var i =0; i < vertices.length; i++) {
  var xy = vertices.getAt(i);
  contentString += "<br />" + "Coordinate: " + i + "<br />" + xy.lat() +"," + xy.lng();
}

// Replace our Info Window's content and position
infowindow.setContent(contentString);
infowindow.setPosition(event.latLng);

infowindow.open(map);
}  
</script>
</head>
<body onload="initialize()">
<div id="map_canvas"></div>
</body>
</html>

Answer 1

问题在于您已将相对引用复制到Google的样式表，而且这是map_canvas的大小定义。

如果您明确设置div的大小，或者使用样式表的绝对引用，它将起作用（我只是尝试过）。

地图不显示在网址上

1 个答案: