谷歌地图api中心到正确的位置，但箭头指向不同的

Question

我正在使用Google Maps API。它大部分都在工作，除了我不能指向正确的箭头。这是我的代码：

<div id="map1" style="height: 200px"></div>
<script>
    function createInfoWindowContent() {
      return ['the place', 'the city'].join('<br>');
    }
    google.maps.event.addDomListener(window, 'load', init);

    function init() {
        // Options for Google map
        // More info see: https://developers.google.com/maps/documentation/javascript/reference#MapOptions
        var mapOptions1 = {
            zoom: 14,
            center: new google.maps.LatLng(42.366012, -71.098702)
            // Style for Google Maps

        };

        // Get all html elements for map
        var mapElement1 = document.getElementById('map1');

        // Create the Google Map using elements
        var map1 = new google.maps.Map(mapElement1, mapOptions1);

          var coordInfoWindow = new google.maps.InfoWindow();
          coordInfoWindow.setContent(createInfoWindowContent());
          coordInfoWindow.open(map1);

    }

</script>

上面的代码确实将地图正确地置于正确的位置，但指针一直在左边，而不是指向该位置。这是一个截图：

如何移动指针？我确定答案很简单，但我遇到了麻烦。

Answer 1

open方法的第二个对象采用一个锚对象：

coordInfoWindow.open(map1,{position:map1.getCenter()})

参考：https://developers.google.com/maps/documentation/javascript/3.exp/reference#InfoWindow

Answer 2

您可以使用InfoWindowOptions对象或setPosition（LatLng）方法设置infoWindow的位置。 https://developers.google.com/maps/documentation/javascript/reference#InfoWindow

Answer 3

使用.setPosition方法转换InfoWindow的位置：

var coordInfoWindow = new google.maps.InfoWindow();
coordInfoWindow.setContent(createInfoWindowContent());
coordInfoWindow.setPosition(mapOptions1.center);
coordInfoWindow.open(map1);

fiddle

或在其构造函数中设置它：

var coordInfoWindow = new google.maps.InfoWindow({
  content:createInfoWindowContent(), 
  position: mapOptions1.center
});
coordInfoWindow.open(map1);

fiddle

代码段

function createInfoWindowContent() {
  return ['the place', 'the city'].join('<br>');
}
google.maps.event.addDomListener(window, 'load', init);

function init() {
  // Options for Google map
  // More info see: https://developers.google.com/maps/documentation/javascript/reference#MapOptions
  var mapOptions1 = {
    zoom: 14,
    center: new google.maps.LatLng(42.366012, -71.098702)
      // Style for Google Maps

  };

  // Get all html elements for map
  var mapElement1 = document.getElementById('map1');

  // Create the Google Map using elements
  var map1 = new google.maps.Map(mapElement1, mapOptions1);

  var coordInfoWindow = new google.maps.InfoWindow();
  coordInfoWindow.setContent(createInfoWindowContent());
  coordInfoWindow.setPosition(mapOptions1.center);
  coordInfoWindow.open(map1);

}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map1" style="height: 200px"></div>