Afficher une carte google map

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Afficher une carte google map

Re: Afficher une carte google map

par yoann38 » 17 févr. 2015, 11:17

Mais que dois je changer stp ?

Re: Afficher une carte google map

par tof73 » 17 févr. 2015, 00:15

tu ajoutes l'appel à la fonction à la fin de la fonction d'initialisation.

<script type="text/javascript">
var geocoder;
var map;
// initialisation de la carte Google Map de départ
function initialiserCarte() {
....
....
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

TrouverAdresse() ;
}
</script>

Afficher une carte google map

par yoann38 » 17 févr. 2015, 00:01

Salut j'ai un ptit bout de code qui marche très bien mais actuellement l'utilisateur est obligé de cliké sur Localiser sur Google Map et j'aimerais que ça soit automatique, que ça lui affiche directement le plan en fonction de l'adresse, vu que je récupère l'adresse en php.

Voici mon code actuel
le coté formulaire a modifier mais ne connait rien en js ...
<form>
  <input type="text" value="<?php echo $zoom['street'];?>,<?php echo $zoom['postcode']?>" id="adresse"/>
  <input type="button"  value="Localiser sur Google Map" onclick="TrouverAdresse();"/>
</form>
et le script
[javascript]
<script type="text/javascript">
var geocoder;
var map;
// initialisation de la carte Google Map de départ
function initialiserCarte() {
geocoder = new google.maps.Geocoder();
// Ici j'ai mis la latitude et longitude du vieux Port de Marseille pour centrer la carte de départ
var latlng = new google.maps.LatLng(43.295309,5.374457);
var mapOptions = {
zoom : 14,
center : latlng,
mapTypeId : google.maps.MapTypeId.ROADMAP
}
// map-canvas est le conteneur HTML de la carte Google Map
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}

function TrouverAdresse() {
// Récupération de l'adresse tapée dans le formulaire
var adresse = document.getElementById('adresse').value;
geocoder.geocode( { 'address': adresse}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
// Récupération des coordonnées GPS du lieu tapé dans le formulaire
var strposition = results[0].geometry.location+"";
strposition=strposition.replace('(', '');
strposition=strposition.replace(')', '');
// Affichage des coordonnées dans le <span>
document.getElementById('text_latlng').innerHTML='Coordonnées : '+strposition;
// Création du marqueur du lieu (épingle)
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert('Adresse introuvable: ' + status);
}
});
}
// Lancement de la construction de la carte google map
google.maps.event.addDomListener(window, 'load', initialiserCarte);
</script>

Merci à vous
[/javascript]