Comment marquer les hotels sur google map? [Résolu/Fermé]

Signaler
-
 manoula -
Bonjour, à vous tous

j'ai un petit problème et je veux que quelqu'un puisse m'aider. en faite je veux mettre sur la carte de ma ville tous les hôtels, sur google map est ce qu'il existe un scripte ???

merci de votre aide



12 réponses

Messages postés
18311
Date d'inscription
dimanche 29 octobre 2006
Statut
Contributeur
Dernière intervention
15 janvier 2020
2587
lu,

ben tu mets en recherche hotels + ville
ou code postale

exemple : hotels paris
http://maps.google.fr/maps?hl=fr&tab=wl
1
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 81046 internautes nous ont dit merci ce mois-ci


il suffit de taper hotels puis une ville

ca donne ceci
http://maps.google.fr/...
1
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 81046 internautes nous ont dit merci ce mois-ci

merci pour votre réponse mais je connais ce lien c pas ca , je veux savoire comment identifier mes hôtels sur la carte en suite remporter le script pour le mettre sur le site que je suis entrain de le faire .
1
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 81046 internautes nous ont dit merci ce mois-ci

voila le site: http://www.commune-sousse.gov.tn/fr/festivite.php
j'ai crée cette carte de ma ville avec les hôtels mais non dynamique je veux mettre une autre comme celle de google map

est ce que il y quelqu'un qui peut m'aidez??
1
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 81046 internautes nous ont dit merci ce mois-ci

Bonjour mes amis ,

Alors pas de solution ???
1
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 81046 internautes nous ont dit merci ce mois-ci

Messages postés
3388
Date d'inscription
jeudi 27 décembre 2007
Statut
Membre
Dernière intervention
15 avril 2019
450
Salut,

Il va te falloir prendre les coordonnées géographique de chacun de tes hotel, et les ajouter manuellement un par un sur ta carte.

Voici un exemple:

fichier carte.html

<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN'>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='fr'>
	<head>
		<title>cartographie Orange</title>
		<meta http-equiv='Content-Type' content='text/html; charset=iso-8859-1' />
		<script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=true'></script>
		<script type='text/javascript' src='carte.js'></script>
	</head>
	<body>
		<script>
			window.onload = function() {
				var maCarte = new Carte(19, 3, 3, 'ROADMAP');
				maCarte.addMarker('titre1', 'nom1', 2.281124, 30.8139);
				maCarte.addMarker('titre2', 'nom2', 2.268911, 33.1888);
				maCarte.addMarker('titre3', 'nom3', 22.68911, 331888);
				maCarte.addMarker('titre4', 'nom4', 2.258455, 30.9690);
				}
		</script>
			<h1>Carte:</h1>
		<br/>
		<div id='map' class='map' style='width:85%; height:75%' >
		</div>
		<noscript>
			<p>Attention : </p>
			<p>Afin de pouvoir utiliser Google Maps, JavaScript doit être activé.</p>
			<p>Or, il semble que JavaScript est désactivé ou qu'il ne soit pas supporté par votre navigateur.</p>
			<p>Pour afficher Google Maps, activez JavaScript en modifiant les options de votre navigateur, puis essayez à nouveau.</p>
		</noscript>
	</body>
</html>


fichier carte.js

var carte;	//declaration de la carte
var bounds;	//limite de la carte en fonciton des marqueurs

function Carte	(
					optZoom,
					Lattitude,
					Longitude,
					optMapTypeId
				)
{
	var optCenterMap = new google.maps.LatLng(Lattitude, Longitude);
	var mapType = google.maps.MapTypeId[optMapTypeId];
	var options =
		{
			center: 				optCenterMap, 		//LatLng(lat:number, lng:number) 		obligatoire
			mapTypeId: 				mapType,			//HYBRID, ROADMAP, SATELLITE, TERRAIN 	obligatoire
			zoom: 					optZoom				//number 								obligatoire
		};
	carte = new google.maps.Map(document.getElementById("map"), options);
	bounds = new google.maps.LatLngBounds();
}

Carte.prototype.addMarker = function 	(
											Window,
											Nom,
											Lattitude,
											Longitude
										)
{
	var info = new google.maps.InfoWindow(
		{
			content: Window
		});
	var optCenterMarker = new google.maps.LatLng(Lattitude, Longitude);
	bounds.extend(optCenterMarker);
	var marker = new google.maps.Marker(
		{
			position : 	optCenterMarker,
			title : 	Nom,
			map : 		carte
		});
	google.maps.event.addListener(marker, 'click', function()
		{
			info.open(carte, marker);
		});
	carte.fitBounds(bounds);
};

1
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 81046 internautes nous ont dit merci ce mois-ci

Merciiiiiiii de votre aide varfendell je vais tester selon ma carte :)
Désolé j'ai une aitre question : comment peut-on avoir les coordonnées géographique car j'ai utilisé ce lien:

http://www.google.com/...

Merci encore
Bon je croit que je vais utiliser google erth pour les trouver

merci
Messages postés
3388
Date d'inscription
jeudi 27 décembre 2007
Statut
Membre
Dernière intervention
15 avril 2019
450
La encore fait ça manuellement:

Fait une carte test sur laquelle tu affichera un marqueur.
Tu rend ce marqueur déplaçable, avec un event qui t'affiche la nouvelle position du marqueur a chaque fois que tu déplaces.
Déplace ce marqueur sur tout les hôtel dont tu veut les coordonnées géographique et le tour est joué :)

PS:

Pour rendre une marqueur déplaçable et ajouter l'event, ajoute ce code apres
carte.fitBounds(bounds);


==>

marker.setDraggable(true);
	
	google.maps.event.addListener(marker, 'dragend', function(event) {
		//message d'alerte affichant la nouvelle position du marqueur
		alert("La nouvelle coordonnée du marqueur est : "+event.latLng);
	});


Sinon pour plus d'info sur l'API v3 de google map, tu peut te rendre:

- sur le site du zero (tutoriel)
- sur le site de google map documentation
Merci varfendell ca c bien passer mais j'ai un autre petit problème :
Quand on met le curseur sur l'hôtel je veux que des infos sur cet hôtel soient afficher par exemple: l'adresse , tel, nombre des étoiles, phots de l'hôtel .

Est ce que je peux ajouter ses données dans le script ???

Merci
varfendell
Messages postés
3388
Date d'inscription
jeudi 27 décembre 2007
Statut
Membre
Dernière intervention
15 avril 2019
450
alors il y a deux possibilité:

Soit tu parle de l'infobulle quand on clique sur le marqueur
soit une info juste quand on passe la marqueur dessus.

Pour cela le script que je t'ai donné en premier lieu se charge des deux possibilité:

var optCenterMarker = new google.maps.LatLng(Lattitude, Longitude);
bounds.extend(optCenterMarker);
var marker = new google.maps.Marker(
{
position : optCenterMarker,
title : Nom,=============> nom est ici une variable qui contient la deusxieme possibilité. Tu peut remplacer par "hotel mercury" par exemple
map : carte
});
créer le contenu de l'info bulle:
var info = new google.maps.InfoWindow(
{
content: //ici tu met ce que tu veut affiché, en html. Par exemple <h1>nom de l'hotel</h1>. Tu peut meme mettre plusieur ligne
});
créer l'evenement "quand on cilque, on affiche l'inffobulle"
google.maps.event.addListener(marker, 'click', function()
{
info.open(carte, marker);
});
merciiiiiii très gentil de ta part :)
les données que tu m'a données de changer sur la page carte.js
et l'affichage de l'infobull sur la page html
????
Messages postés
3388
Date d'inscription
jeudi 27 décembre 2007
Statut
Membre
Dernière intervention
15 avril 2019
450
En effet, les lignes
maCarte.addMarker('titre1', 'nom1', 2.281124, 30.8139);


contiennent ces informations:

Dans titre1 tu met le contenu de la fenetre (windows) qui s'affichera lors du clic (essaye de cliquer et tu verra s'afficher titre1)
et dans nom1 tu met le nom du marqueur qui s'affichera quand la souris passera dessus (passe ta souris sur un marqueurs et tu verra nom1 s'afficher).
vraiment je suis très désolé :/

voila mon script après le changement mais en testant la carte ne s'affiche pas :(
<script>
			window.onload = function() {
				var maCarte = new Carte(19, 3, 3, 'ROADMAP');
				maCarte.addMarker('var info = new google.maps.InfoWindow(
				{ <h1>hôtel sousse palace</h1>}); ', 'google.maps.event.addListener(marker, 'click', function(){info.open(carte, marker);});', 35.83097051764975, 10.641005467796303);
				
		</script>
merci milllllllle fois :)

tt est bien ;)
varfendell
Messages postés
3388
Date d'inscription
jeudi 27 décembre 2007
Statut
Membre
Dernière intervention
15 avril 2019
450
oublie pas de marquer ton sujet comme résolu
OK :)

Une autre chose SVP quand je clique sur les infobulle tt ils s'affichent ,or normalement l'autre se disparut quand on ou clique sur la deuxième

comme cette exemple :
http://www.google.com/...
varfendell
Messages postés
3388
Date d'inscription
jeudi 27 décembre 2007
Statut
Membre
Dernière intervention
15 avril 2019
450
En effet, c'est un problème que je n'ai pas encore résolu.
Je ne me suis pas vraiment intéressé a ce problème, si sa t'intéresse, voici la doc de google map API v3:
documentation
tu trouveras dedans toute les méthode et tout les attribut de chaque méthode ou objet, et donc la réponse se cache quelque part dedans. La java doc est cependant en anglais et n'existe pas encore en français.
Merci encore :) je vais le voire