Est-il un moyen de Corriger une Google Maps Marqueur au Centre de sa Carte?
Pour être plus précis, ce que je cherche à accomplir, c'est que, pendant que je Glisser une Carte Google map il y a un Google Maps Marqueur qui reste fixe au centre de la carte à tout moment.
Cela permettra d'améliorer l'expérience Utilisateur, à mon avis, C'est la façon dont je le fais maintenant:
var map, marker, options;
options = {
center: new google.maps.LatLng(latitude, longitude),
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false,
overviewMapControl: false,
zoomControl: true,
draggable: true
};
map = new google.maps.Map(mapContainer, options);
marker = new google.maps.Marker({
position: new google.maps.LatLng(latitude, longitude),
map: map,
animation: google.maps.Animation.DROP
});
//This line is what makes the Marker stick to the center of the map
marker.bindTo('position', map, 'center');
Le problème que j'ai avec le code ci-dessus est que.. Quand je fais glisser la carte en dessous du Marqueur ce n'est pas assez lisse, c'est à dire. le Marqueur fait bizarre sauter de la "dernière" de centre à la "nouvelle" center lorsque vous faites glisser les extrémités. (c'est plus visible sur les appareils mobiles), Donc ce que j'ai besoin est que le Marqueur est Vraiment fixé de façon permanente au Centre de sa Carte.
Est-il un moyen pour obtenir ce fait? (Je pense que je l'ai vu dans un site web une fois)
Laissez-moi savoir Si vous pouvez m'aider.
Merci.
- avez-vous essayé de liaison de google.cartes.Position du marqueur à la google.cartes.Carte du centre de l'objet de la propriété?
- Négatif, monsieur, La seule solution qui me vient en tête après la lecture de la documentation, est celui que vous voyez là. Si vous pouviez me dire comment faire ce que vous avez décrit, je lui en serais vraiment reconnaissant.
- En fait, je pense que c'est ce que je fais maintenant? droit?
- Oui. Et cela fonctionne pour moi. N'est-il pas de travail pour vous?
- Ok, Pourriez-vous s'il vous plaît essayer sur un téléphone mobile et laissez-moi savoir Si ce n'est pas faire tout bizarre "Sauts", comme vous faites glisser la carte 🙂 Parce que là où le problème se pose. Sur un ordinateur de Bureau/ordinateur portable, il n'y a pas de problème apparent. Merci pour vos réponses, monsieur!
- Nope. N'avez pas de téléphone mobile avec les données.
- La poisse! Êtes-vous sûr il n'y a pas d'autre façon de le faire? Merci tout de même.
- Avez-vous vu ce post, trouvé sur ce post pour le groupe
- n'est-il pas le marqueur est de sauter sur le lien donné par @geocodezip
Vous devez vous connecter pour publier un commentaire.
Une approche différente, qui n'utilisent pas un réel
google.maps.Marker
:après que la carte a été initialisé, injecter une div dans la carte-conteneur, lui donner un nom de classe(p. ex.
centerMarker
), plus les choses seront faites via CSS:Démo: http://jsfiddle.net/doktormolle/jcHqt/
Plutôt que d'injecter un composant HTML comme suggéré dans @Dr Molle du réponse, pourquoi n'utilisez-vous pas un CSS seule solution.
C'est plus simple, plus efficace et ne nécessite pas de toucher même les DOM (donc il n'y aura pas de problèmes si Google change leur mise en œuvre).
Aussi depuis que Google Maps ne pas appliquer les styles sur l'élément conteneur (
#map
) la solution est assez sûr.Ici est un jsFiddle.
Vous pouvez écouter le centre de modifications par quelque chose comme ci-dessous, vous aurez juste à mettre à jour votre vue:
Courant principal de la solution utilisée est d'élever l'InfoWindow uniquement lorsque onclick, j'avais besoin d'elle tout le temps comme il est sur Uber, je l'ai donc remplacé, même l'InfoWindow à un css seule solution, la mise à jour de la vue normale angulaire de la route avec Ionique
HTML:
CSS:
Contrôleur:
Je ne sais pas si il y a des problèmes de performances avec cela, mais semble assez lisse sur l'appareil, espérons que cela aide quelqu'un
Si cela peut aider, ce que j'ai fait est :
Vous pouvez utiliser google map événement glisser: