map.fitBounds работает странно, когда на карте установлена ​​опция «ограничение»

Question

У меня есть 2 маркера на карте.Я хочу сделать эти два маркера видимыми на карте, когда происходит какое-то событие.Но при добавлении опции restriction на карту fitBounds маркеры не отображаются.Когда я удаляю restriction вариант, кажется, работает правильно.Вот пример кода:

var map, markers;

var locations = [{
    lat: 50.8503396,
    lng: 4.351710300000036
  },
  {
    lat: 49.9570366,
    lng: 36.3431478
  },
];

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    zoom: 1,
    center: {
      lat: -28.024,
      lng: 140.887
    },
    restriction: {
      strictBounds: true,
      latLngBounds: {
        north: 85,
        south: -85,
        west: -180,
        east: 180
      },
    },
  });

  markers = locations.map(function(location, i) {
    return new google.maps.Marker({
      position: location
    });
  });

  markers.forEach(function(marker) {
    marker.setMap(map);
  });
}


setTimeout(function() {
  var bounds = new google.maps.LatLngBounds();
  markers.forEach(function(marker) {
    bounds.extend(marker.position);
  });
  map.fitBounds(bounds);
}, 5000);

#map {
  height: 400px;
}

<div id="map"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap">
</script>

https://jsfiddle.net/fedman/6eoty0vm/

Answer 1

Это похоже на ошибку.Он хорошо работает с версией 3.34 API, как показано в коде ниже.Кажется, работает также хорошо в зависимости от высоты контейнера карты (пробовал с высотой 200 пикселей, и это работало даже с последними версиями).

Я открыл ошибку в трекере проблем .

var map, markers;

var locations = [{
    lat: 50.8503396,
    lng: 4.351710300000036
  },
  {
    lat: 49.9570366,
    lng: 36.3431478
  },
];

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    zoom: 1,
    center: {
      lat: -28.024,
      lng: 140.887
    },
    restriction: {
      strictBounds: true,
      latLngBounds: {
        north: 85,
        south: -85,
        west: -180,
        east: 180
      },
    },
  });

  markers = locations.map(function(location, i) {
    return new google.maps.Marker({
      position: location
    });
  });

  markers.forEach(function(marker) {
    marker.setMap(map);
  });
}


setTimeout(function() {
  var bounds = new google.maps.LatLngBounds();
  markers.forEach(function(marker) {
    bounds.extend(marker.position);
  });
  map.fitBounds(bounds);
}, 5000);

#map {
  height: 400px;
}

<div id="map"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer src="https://maps.googleapis.com/maps/api/js?v=3.34&key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap">
</script>