您已在此页面上多次添加Google Maps API

时间:2014-08-05 10:20:18

标签: javascript wordpress google-maps google-maps-api-3

我正在使用谷歌地图api v3。我使用wpestate房地产wordpress主题。这是我在模板文件中的代码..

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script src="https://maps.googleapis.com/maps/api/js?   
  v=3.exp&sensor=false&libraries=places"></script>
  <script>
var geocoder;
var map;
function initialize() {

var input = document.getElementById('address');
var options = {

componentRestrictions: {country: "in"}
};
var autocomplete = new google.maps.places.Autocomplete(input,options);
geocoder = new google.maps.Geocoder();


//var latlng = new google.maps.LatLng(18.52043030000, 73.85674369999);

var mapOptions = {
 zoom: 15,
//center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,

}

var map = new google.maps.Map(document.getElementById('googleMap'), mapOptions);

}



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


 google.maps.event.addDomListener(window, 'load', initialize);
 </script>

它按预期运行但在控制台中出错“您已在此页面上多次包含Google Maps API。这可能会导致意外错误。”因为该地图不会在地图上显示属性。

3 个答案:

答案 0 :(得分:5)

删除第一行:

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>

您要两次使用Google Maps API。

答案 1 :(得分:0)

您的问题是,就像其他人发现的那样,Google地图的重复脚本。请查看以下链接以获取工作代码。

http://jsbin.com/husahasu/1/edit

要渲染地图,您需要指定其中心。没有它就无法渲染。 您还需要为元素添加css。 把它放在文件的头部。

<style type="text/css">
 html { height: 100% }
 body { height: 100%; margin: 0; padding: 0 }
 #googleMap { height: 100% }
</style>

答案 2 :(得分:0)

在我的情况下,我在顶部和div之前插入了两次到库的链接。 我删除了任何链接,它会起作用。您检查页面中的链接。