11548 sujets

JavaScript, DOM et API Web HTML5

Google Maps V.3: récupération de coordonnées

Bonjour à tous,

Voila mon petit soucis: je travail sur un moyen de géolocalisation pour un site avec Google Maps V.3. Le problème que je rencontre est de pouvoir générer les marqueurs automatiquement à partir d'une <div id="geoloc">. Pour le moment je le fait en dure histoire d'y aller pas à pas mais déjà j'ai un problème: je n'arrive pas à récupérer cette info...
J'ai tout essayé, rien n'y fait... Auriez-vous une idée?

A titre informatif, j'ai recopié le code javascript. Je n'arrive pas à trouver ce qu'il faut mettre à la place de $("div[id='geoloc']").value pour les récupérer...

Merci d'avance pour votre aide.



/****** Script pour Google Map API *****/

function initializeMap()
{


/****************************************
LES POINTS DE REPÈRES
*****************************************/

	/* Point de base, la carte sera centrée dessus */
	var centreCarte = new google.maps.LatLng(48.581805,7.750359);	

	
/****************************************
DÉFINITION DES OPTIONS DE LA CARTE
*****************************************/

	var optionsCarte =
	{
		zoom:15,
		center: centreCarte,
		mapTypeId: google.maps.MapTypeId.ROADMAP
	}
	
	
/****************************************
AFFICHAGE DE LA CARTE
*****************************************/

	var Carte = new google.maps.Map(document.getElementById("geomap"), optionsCarte);
	
	
/****************************************
AFFICHAGE DES MARQUEURS
*****************************************/


	/* Marqueur de base*/
	var Marqueur =
	{
		position: $("div[id='geoloc']").value,
		map: Carte,
		title: "Marqueur 1"
	}	
	var marqueur1 = new google.maps.Marker(Marqueur);


}

Modifié par Pepe` (26 Jul 2010 - 10:47)
Bonjour,

Pepe` a écrit :
Le problème que je rencontre est de pouvoir générer les marqueurs automatiquement à partir d'une <div id="geoloc">.

À priori un marqueur ne se crée pas à partir d'un élément du DOM (un DIV ou autre chose) mais en créant un objet google.maps.Marker.
Qu'entends-tu par créer un marqueur à partir d'un DIV?

Pepe` a écrit :
je n'arrive pas à récupérer cette info...

C'est une info que tu as quelque part, ou bien tu as besoin de la récupérer en interrogeant les serveurs de Google?
Pardon, désolé du retard.
En fait j'utilise une div dans laquelle j'écris les données en dure:
<div id="geoloc"> 47.59871,7.58422</div> (données fictives)

Je voudra ensuite dire au marker que je crée d'aller chercher les coordonnées dans la div (d'où un getelementbyid qui ne semble pas fonctionner...
Eh bien la réponse est dans la documentation:
http://code.google.com/intl/fr/apis/maps/documentation/javascript/overlays.html#Markers

Pour créer ton marqueur tu utilises une fonction de l'API à laquelle tu passes un objet qui doit avoir certaines propriétés, dont la propriété position. La valeur que tu as attribuée à cette propriété est la suivante:
$("div[id='geoloc']").value

Il y a plusieurs problèmes ici:
1. C'est un peu verbeux pour un sélecteur jQuery, $('#geoloc') suffit.
2. Les objets jQuery (tu en crées un avec $(...)) n'ont pas de propriété "value".
3. Ils n'ont pas non plus de méthode "value". Il y a une méthode "val", mais $('#geoloc').val() retournera une chaine vide pour un DIV (ça s'utilise plutôt pour les champs de formulaire).
4. Je suppose donc que tu voulais utiliser $('#geoloc').text() (et parcourir à nouveau la documentation de jQuery Smiley cligne ). Ça te retournera la chaine de caractères "47.59871,7.58422".
5. Tu ne peux pas passer cette chaine de caractères comme valeur de la propriété position. Il faut passer un object google.maps.LatLng. Pour le créer tu as besoin d'avoir, sous la forme de nombre (et pas de chaines de caractères) tes deux coordonnées. À priori il faudra spliter ta chaine de caractères, et utiliser la fonction parseFloat.

Mais, pour commencer, pourquoi stocker ces informations dans du texte HTML, plutôt que de produire directement du JavaScript? Ton script côté serveur pourrait générer directement quelque chose comme ceci:
<script type="text/javascript">
var markerPosition = new google.maps.LatLng(47.59871,7.58422);
</script>

Ou, s'il y a plusieurs marqueurs, un tableau. Un exemple dans ce genre:
http://bit.ly/ckKp66
Bonjour,

Je ne sais si cela fait partie du même post, mais je voudrais afficher un logo dans le coin supérieur droit ou gauche en ayant la Longitude et la Latitude d'origine.

Comment peut-on obtenir ces coordonnées (en V3) je coince en ayant essayé diverses méthodes.

L'overlay d'un marker utilise les coordonnées, mais comment calculer celles-ci ?
Sujet clos
Aller à