0

我试图“模仿”这张地图的代码：

https://google-developers.appspot.com/maps/documentation/javascript/examples/geocoding-simple

仅将 Syney 更改为 Porto Alegre（在表单值和坐标中）。但是出现了问题，因为地图画布没有显示在屏幕上。我检查了代码，没有发现任何拼写错误或语法错误。

我希望有人能提供帮助。实际上，与 Google Maps API 相比，我更喜欢使用 Fusion Tables。

<!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>GEOCODER</title>
<link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet">
<script src="https://maps.google.com/maps/api/js?sensor=false"></script>
<script>

var geocoder;
var map;
function initialize() {
   geocoder = new google.maps.Geocoder();
   var latlng = new google.maps.LatLng(-30.027704, -51,228735);
   var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
   }
   map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

function codeAddress() {
   var address = document.getElementById("address").value;
   geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
         map.setCenter(results[0].geometry.location);
         var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location
         });
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
   );
  }
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width: 320px; height: 480px;"></div>
<div>
   <input id="address" type="textbox" value="Porto Alegre, Brasil">
   <input type="button" value="Encode" onclick="codeAddress()">
</div>
</body>
</html>
4

2 回答 2

2

您可能交换了两行，导致语法错误。如果您检查 JavaScript 控制台，您会看到错误消息。当 JS 没有按照您期望的那样做时，您真的应该这样做（或者，几乎总是如此，只是为了确保没有任何意外错误）。

你有这个：

      }
   );
  }
}
</script>

你要这个：

      }
   }
  );
}
</script>
于 2012-07-31T01:42:41.517 回答
0

请注意，您在标题中提供了指向 CSS 文件的相对链接。这适用于谷歌的服务器，但可能不适用于您的服务器，除非您创建了相同的相对路径。试试这个：

<link href="https://google-developers.appspot.com/maps/documentation/javascript/examples/geocoding-simple/maps/documentation/javascript/examples/default.css" rel="stylesheet">
于 2012-07-31T01:53:53.957 回答