Comment redimensionner dynamiquement une carte Google avec JavaScript ?

Comment redimensionner une carte Google Map avec JavaScript après le chargement

Lorsque vous travaillez avec Google Maps, il est parfois nécessaire de redimensionner la carte une fois qu'elle est déjà chargée. Cela peut être réalisé via JavaScript, mais cela nécessite certaines étapes spécifiques pour garantir que les tuiles de la carte s'ajustent en conséquence.

Pour redimensionner une carte Google Map dans la version 3, suivez cette procédure :

1. Redimensionner le parent
   ou un élément conteneur qui contient la carte Google Map à l'aide de JavaScript ou CSS.
2. Déclenchez l'événement "resize" sur l'objet Google Map.

Déclenchez l'événement de redimensionnement

Dans Google Maps v3, l'événement de redimensionnement doit être déclenché explicitement :

<code class="javascript">google.maps.event.trigger(map, "resize");</code>

où map est l'objet Google Map qui doit être redimensionné.

Exemple avec jQuery

Voici un exemple utilisant jQuery pour gérer le redimensionnement de la fenêtre et déclencher le redimensionnement de Google Map :

<code class="javascript">$(function() {
  var map = new google.maps.Map($("#map-canvas")[0], mapOptions);

  $(window).resize(function() {
    google.maps.event.trigger(map, "resize");
  });
});</code>

En suivant ces étapes, vous pouvez redimensionner efficacement une Google Map et vous assurer que les tuiles de la carte s'ajustent et s'affichent correctement dans les nouvelles dimensions.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!