Angular-google-maps: FitBounds quand pas de marqueur + zoom par défaut ?

Créé le 25 sept. 2018  ·  22Commentaires  ·  Source: SebastianM/angular-google-maps

salut

Le nouveau fitBounds automatique est génial mais il semble que 2 améliorations pourraient être apportées :

  • lorsqu'aucun marqueur n'est sur la carte, fitBounds atterrit au milieu de l'océan Pacifique. Peut-être que ça ne devrait rien faire du tout ?
  • lorsqu'il n'existe qu'un seul marqueur, le zoom fitBounds sera maximal, serait-il possible de configurer un fitBounds.maxZoom qui ne s'activerait que pour un seul marqueur ?

Le contournement est possible mais un peu sale

Merci

important stale

Commentaire le plus utile

Cela semble fonctionner assez bien pour moi.

<agm-map [latitude]="locations[0].lat()" [longitude]="locations[0].lng()" [fitBounds]="locations.length > 1" [zoom]="14">
    <ng-template ngFor [ngForOf]="locations" let-location>
        <agm-marker [latitude]="location.lat()" [longitude]="location.lng()" [agmFitBounds]="true"></agm-marker>
    </ng-template>
</agm-map>

Tous les 22 commentaires

Cela m'affecte aussi. J'ai défini les coordonnées du centre en utilisant latitude et longitude sur la carte agm mais lorsque fitBounds est activé, il ne se centre pas sur ces coordonnées (bien qu'il n'y ait pas de marqueur), à la place, l'océan est affiché comme décrit par @jscti.

+1 sur suggestion de @jscti => lorsqu'aucun marqueur n'est sur la carte, fitBounds atterrit au milieu de l'océan Pacifique. Peut-être que ça ne devrait rien faire du tout ?

Quelqu'un a-t-il une idée sur la façon dont nous pourrions parvenir à « ne rien faire du tout » s'il n'y a pas de marqueurs sur la carte ?

Encore un grand bravo (A++) et merci pour la bibliothèque, c'est génial !

@jscti , ça vous dérangerait de partager comment vous « contournez » s'il vous plaît ?

@ironstine

En l'absence de marqueur, je désactive fitBounds et force lat/lon/zoom :

this.fitBounds = false;
setTimeout(() => {
    this.latitude = this.DEFAULT_LATITUDE;
    this.longitude = this.DEFAULT_LONGITUDE;
    this.zoom = this.DEFAULT_ZOOM_VAL;
});

S'il y a un seul marqueur, je force le zoom à une valeur spécifique

Cela semble fonctionner assez bien pour moi.

<agm-map [latitude]="locations[0].lat()" [longitude]="locations[0].lng()" [fitBounds]="locations.length > 1" [zoom]="14">
    <ng-template ngFor [ngForOf]="locations" let-location>
        <agm-marker [latitude]="location.lat()" [longitude]="location.lng()" [agmFitBounds]="true"></agm-marker>
    </ng-template>
</agm-map>

salut

J'ai un problème différent : mon application prend la latitude et la longueur de l'utilisateur pour centrer la carte au début. Puis lorsqu'il commence à compiler des champs beaucoup d'adresses sont géolocalisées puis marquées sur la carte. Mais cela ne fonctionne pas avec les fitbounds pour les raisons suivantes :
1) si je ne définis pas de fitbounds, la carte est correctement centrée sur l'emplacement de l'utilisateur ; lorsque l'utilisateur compile des champs, les marqueurs sont ajoutés mais la carte ne rentre pas dans les limites ;
2) si je définis les fitbounds sur true, la carte est centrée au milieu de l'océan Pacifique ; lorsque l'utilisateur compile des champs, les marqueurs sont ajoutés mais la carte effectue un zoom arrière.

De l'aide? c'est mon vrai code

Le html :

<agm-map #agmMap [style.height.px]="utilsService.calculateMapHeight()" [zoom]="13" [streetViewControl]="false" [fitBounds]="true" [latitude]="genericConstants.lat" [longitude]="genericConstants.lng">
    <agm-marker *ngFor="let l of departuresMarkersList" [latitude]="l.lat" [longitude]="l.lng" [title]="l.name" [label]="l.name" [agmFitBounds]="true"></agm-marker>
    <agm-marker *ngFor="let l of destinationsMarkersList" [latitude]="l.lat" [longitude]="l.lng" [title]="l.name" [label]="l.name" [agmFitBounds]="true"></agm-marker>
    <agm-marker *ngIf="cardMarker !== undefined" [latitude]="cardMarker.lat" [longitude]="cardMarker.lng" [title]="cardMarker.name" [label]="cardMarker.name" [agmFitBounds]="true"></agm-marker>
</agm-map>

Les ts :

this.utilsService.geoLocalize(fullAddress).then((landmark: Landmark) => {

    const serviceLandmark = new ServiceLandmark(null, type, landmark.lat, landmark.lng, null, null, fullAddress);
    if (type === 'departures') {

          if (this.reopenIndex === -1) {
            this.departuresMarkersList.push(serviceLandmark);
          } else {
            this.departuresMarkersList[this.reopenIndex] = serviceLandmark;
          }

    } else if (type === 'destinations') {

          if (this.reopenIndex === -1) {
            this.destinationsMarkersList.push(serviceLandmark);
          } else {
            this.destinationsMarkersList[this.reopenIndex] = serviceLandmark;
          }

    } else {
          this.cardMarker = serviceLandmark;
    }
}

Ce problème a été automatiquement marqué comme obsolète car il n'a pas eu d'activité récente. Il sera fermé si aucune autre activité ne se produit. Merci pour vos contributions.

Le moyen facile de résoudre les problèmes.

  1. Ok, donc s'il n'y a rien du tout, où la carte serait-elle centrée ?
  2. Pas facile à faire, car il faut gérer le passage du placement de la vue de la carte par centre, à son placement par limites

Bonjour, désolé, je pense que mon dernier commentaire était un peu dur.

Je crois qu'il y a maintenant trois problèmes dans ce fil:

1. fitBounds est actif, il n'y a pas de marques

Problème : fitBounds est défini sur true, mais aucun marqueur n'a été ajouté. Il en résulte que la carte est centrée au milieu de l'océan.

J'irais avec la suggestion d'OP : si aucun marqueur n'existe (et que fitBounds est actif), la carte ne doit pas être centrée (comme dans ne rien faire en plus du comportement par défaut de Google Maps).

2. fitBounds est actif, il y a un marqueur, zoom maximum

Problème : avec fitBounds défini sur true et un seul marqueur, la carte sera agrandie au niveau maximum.

Ce n'était pas un problème pour moi, mais je peux voir des cas d'utilisation dans lesquels une option pour définir un zoom maximum pour fitBounds serait effectivement utile.

3. fitBounds est actif, des marqueurs sont ajoutés après le centrage initial, la carte effectue un zoom arrière

Problème : lorsque fitBounds est actif sans marqueurs initiaux, la carte est centrée sur l'océan. Si des marqueurs sont ajoutés par la suite, la carte ne fait qu'un zoom arrière pour afficher tous les marqueurs.

Je ne suis pas tout à fait sûr d'avoir bien compris celui-ci et de savoir quoi faire à ce sujet. Serait-il possible de "simplement effectuer l'action fitBounds" après un zoom arrière pour afficher tous les marqueurs ? Cela entraînerait un zoom arrière sur la carte pour afficher tous les marqueurs et un nouveau zoom pour afficher _uniquement_ les marqueurs.

Continue comme ça!

Ok, pour le 1er cas, que veut dire "Ne rien faire" ? Que montrerait-il ?
Pour le deuxième cas, il est clair à quoi cela devrait ressembler, mais c'est difficile à mettre en œuvre. De plus, ce n'est pas un cas d'utilisation courant d'avoir des fitBounds avec un seul élément.

1- La carte ne doit pas se centrer automatiquement et rester à la latitude/longitude désignée

"De plus, ce n'est pas un cas d'utilisation courant d'avoir des fitBounds avec un seul élément."
=> Ouais mais quand les marqueurs viennent d'un serveur tu ne sais pas s'il va falloir afficher 0,1,n

Le problème est que vous ne fournissez pas la latitude/longitude désignée lorsqu'il y a fitBounds

De plus, comment maxZoom se comportera-t-il lorsqu'il Y A plusieurs points et qu'ils sont plus proches les uns des autres que maxZoom ne le permet

Le problème est que vous ne fournissez pas la latitude/longitude désignée lorsqu'il y a fitBounds

Pourquoi pas ? C'est juste que fitBounds l'ignore. Mais quand il n'y a pas de marqueurs, peut-être que fitBounds devrait se désactiver automatiquement et utiliser lon/lat
C'est la solution de contournement que j'ai faite manuellement

De plus, comment maxZoom se comportera-t-il lorsqu'il Y A plusieurs points et qu'ils sont plus proches les uns des autres que maxZoom ne le permet

Nous ne parlions que du cas "un seul marqueur. Je comprends que les deux options ne sont pas parfaites :

  • une nouvelle propriété "maxZoom" qui ne devrait être utilisée que pour 1 marqueur, mais si les utilisateurs l'utilisent pour plus de marqueurs .. c'est leur souhait/problème et les marqueurs peuvent sortir de la carte
  • un nouveau "maxZoomForSingleMarker" ne serait utilisé que lorsqu'il y a 1 marqueur

Ma solution de contournement pour tous ces cas où ne PAS utiliser fitbound pour tous ces cas spécifiques et c'est assez moche quand vous regardez le code, c'est pourquoi peut-être que futboud aurait pu tout gérer en interne mais c'est peut-être juste un "agréable à avoir "

le problème avec maxZoom ou maxZoomForSingleMarker, c'est que pour fitBounds, nous utilisons la fonction Bounds.extend , qui construit un LatLngBounds basé sur un certain nombre de points LatLng. Cette fonctionnalité n'accepte pas de niveau de zoom, et il n'est pas très facile de passer du centre/zoom aux limites et en arrière.

Quant à fournir la lat/lng centrale et fitBounds, c'est problématique, car par exemple il se recentrera si la latlng centrale change, même si les fitBounds sont actifs. Actuellement, nous ne le recommandons pas.

Quel est le comportement par défaut de google maps lorsqu'il est affiché sans fitBounds activé ? Je pense que c'est ce que nous désirons lorsqu'il n'y a pas de marqueurs (et fitBounds est vrai). Cela signifierait : ignorez simplement fitBounds s'il n'y a pas de marqueurs.

Je pense que c'est le problème principal de ce fil, peut-être que des problèmes distincts devraient être ouverts pour d'autres sujets (comme maxZoom), même s'ils sont liés. Qu'en penses-tu?

Il n'y a pas de fitBounds dans google, tout est AGA.

Euh... je pourrais essayer

Ce problème a été automatiquement marqué comme obsolète car il n'a pas eu d'activité récente. Il sera fermé si aucune autre activité ne se produit. Merci pour vos contributions.

onMapReady(événement) {
this.mapReady = événement ;
}

limites const : LatLngBounds = new google.maps.LatLngBounds();
for (const pol de this.polyLinePoints) {
bounds.extend(nouveau google.maps.LatLng(pol.lat, pol.lng));
}
this.mapReady.fitBounds(bounds);

Je voulais partager une solution de contournement pour le problème 1 (carte centrée au milieu de l'océan Pacifique lorsque fitBounds est vrai et qu'il n'y a pas de marqueurs).

La réponse de brianpkelley résout le problème d'une certaine manière : la carte ne fera rien (pas de panoramique, pas de zoom) lorsque vous recevez un nouveau tableau vide de marqueurs.

Cependant, si vous souhaitez réinitialiser complètement la carte dans un tel cas, vous pouvez le faire comme ceci :

<ng-container *ngIf="markers.length > 0; else noMarkersTemplate">
    <agm-map [fitBounds]="true">
        <!-- Your markers here... -->
    </agm-map>
</ng-container>

<ng-template #noMarkersTemplate>
    <agm-map [latitude]="25" [longitude]="-81" [zoom]="4"></agm-map>
</ng-template>

Cela centrera la carte au point avec latitude = 25, longitude = -81 et réglera le zoom sur 4.

Cette page vous a été utile?
0 / 5 - 0 notes