当地图有响应式布局时，如何在所有窗口上制作地图点中心？

Question

我在制作响应式地图时遇到问题。因为当我重新调整我的浏览器宽度图时，不要停留在中心位置。我希望地图保持中心（响应）。

css for the map

.map {
  width: 440px;
}

@media only screen and (max-width: 768px)

.map {
  width: 250px;
}

和jquery

<script>

var map;
var markers = [];
var bounds = new google.maps.LatLngBounds();

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


infoWindow = new google.maps.InfoWindow();


var latlng = new google.maps.LatLng(parseFloat(-32.896614),parseFloat(151.697491));   

var marker = new google.maps.Marker({ map: map, position: latlng });
//map.setZoom(1);

var html = "<a href='http://www.gate7infotech.com/projects/development/ron-job-boar/?job_board=kooinda-work-based-child-care-centre'><b>Kooinda Work Based Child Care Centre </b></a> <br/><p>The University of Newcastle University Drive</p><p>Callaghan, New South Wales</p><p>NSW 2308, Australia</p><br>";
//var cleanaddy = address.replace(/<\/?[^>]+(>|$)/g, "");
html +='<form action="http://maps.google.com/maps" method="get"" target="_blank">'+'<input type="hidden" name="daddr" value=""/>';

google.maps.event.addListener(marker, 'click', function(){

infoWindow.setContent(html);
infoWindow.open(map, marker);
});


markers.push(marker); 

bounds.extend(latlng);
 map.fitBounds(bounds);
setTimeout(function() { map.setZoom(15); } , 800);
</script>

在这样的全屏地图上

：

当我让它响应时，它不会显示在中心位置，例如： -

我想把重点放在中心位置。

Answer 1

一种选择是在bounds_changed上设置地图事件监听器，并在每次更改时将中心设置为已知点。例如：

    var center = new google.maps.LatLng(41.850033, -87.6500523);
    ...
    google.maps.event.addListener(map, 'bounds_changed', function() {
        map.setCenter(center);
    });