Question

我使用谷歌地图api制作带有自定义标记和按钮的地图，可以更改地图的中心和缩放。我有一个地图和infoWindow的全局变量。初始化时，我的地图显示为灰色，没有缩放控件我没有在控制台中显示任何错误消息。我有五个按钮叫做：Asia，NorthAmerica，middleEast，newYork，newEngland。这些按钮用于更改地图的中心和缩放。但我希望地图从

中的初始位置开始

var mapOptions= {
    center: new google.maps.LatLng(38.423734,27.142826), 
    zoom: map.setZoom(4)
  };

我在位置对象中使用foreach循环来自定义地图上的标记和infoWindows。我还有一个功能来设置制造商的类型。这很有效。

$(document).ready(function(){

var map, infoWindow;

自定义标记类型的功能

function initMap() {

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

var mapOptions = {
    center: new google.maps.LatLng(38.423734,27.142826), 
    zoom: map.setZoom(4)
  };

$("#asia").on('click', function () {
newLocation(37.566535,126.977969,5);
});
$("#northAmerica").on('click', function () {
newLocation(30.902225,-90.659180,4);
});
$("#middleEast").on('click', function () {
newLocation(38.423734,27.142826,4);
});
$("#newYork").on('click', function () {
newLocation(40.753159,-73.98936,12);
});
$("#newEngland").on('click', function () {
newLocation(42.292783,-71.304496,7);
});

'google.maps.event.addDomListener（window，'load'，initMap）;'是for循环添加自定义标记后我的initMap函数的一部分。

关闭initMap函数但仍然在$（document）.ready（function（）{initMap被调用并且函数newLocation被定义 google.maps.event.addDomListener（window，'load'，initMap）;

用于自定义标记的每个循环

自定义标记位置和infoWindow内容的对象

function newLocation(newLat,newLng,newZoom) {
map.setCenter({
    lat : newLat,
    lng : newLng,
  }); 
map.setZoom(newZoom)
};

initMap();

});

Answer 1

我发布的initMap函数发出了一个javasscript错误：Uncaught TypeError: map.setZoom is not a function：zoom: map.setZoom(4)

应该是：zoom: 4

代码段

function initMap() {
  var mapOptions = {
    center: new google.maps.LatLng(38.423734, 27.142826),
    zoom: 4
  };

  map = new google.maps.Map(document.getElementById('map'), mapOptions)

  $("#asia").on('click', function() {
    newLocation(37.566535, 126.977969, 5);
  });
  $("#northAmerica").on('click', function() {
    newLocation(30.902225, -90.659180, 4);
  });
  $("#middleEast").on('click', function() {
    newLocation(38.423734, 27.142826, 4);
  });
  $("#newYork").on('click', function() {
    newLocation(40.753159, -73.98936, 12);
  });
  $("#newEngland").on('click', function() {
    newLocation(42.292783, -71.304496, 7);
  });
}

google.maps.event.addDomListener(window, 'load', initMap);

function newLocation(newLat, newLng, newZoom) {
  map.setCenter({
    lat: newLat,
    lng: newLng,
  });
  map.setZoom(newZoom)
};

html,
body,
#map {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="asia" value="asia" type="button" />
<input id="northAmerica" value="northAmerica" type="button" />
<input id="middleEast" value="middleEast" type="button" />
<input id="newYork" value="newYork" type="button" />
<input id="newEngland" value="newEngland" type="button" />
<div id="map"></div>

为什么谷歌地图显示为灰色而不是初始化缩放＆amp;当使用带有jQuery的按钮来改变缩放和居中在地图上的中心工作完美

自定义标记类型的功能

自定义标记位置和infoWindow内容的对象

1 个答案: