How to Resize a Google Map After Loading with JavaScript?

Resizing a Google Map after Loading with JavaScript

Resizing a Google Map to fit a larger container after it has loaded can be achieved with a simple trigger. In Google Maps v3, the resize event is triggered differently:

google.maps.event.trigger(map, "resize");

Refer to the Google Maps API documentation for more information on the resize event.

Update:

For a practical example, consider the following code snippet using jQuery:

$(function() {
  var mapOptions = {
    zoom: 8,
    center: new google.maps.LatLng(-34.397, 150.644)
  };
  var map = new google.maps.Map($("#map-canvas")[0], mapOptions);

  // Listen for window resize event and trigger map resize
  $(window).resize(function() {
    google.maps.event.trigger(map, "resize");
  });
});

The above is the detailed content of How to Resize a Google Map After Loading with JavaScript?. For more information, please follow other related articles on the PHP Chinese website!