Sujet Précédent Sujet Suivant

Api google map et marqueur

sourissot123456 Messages postés 2 Date d'inscription dimanche 2 octobre 2011 Statut Membre Dernière intervention 2 octobre 2011 - 2 oct. 2011 à 19:01
sourissot123456 Messages postés 2 Date d'inscription dimanche 2 octobre 2011 Statut Membre Dernière intervention 2 octobre 2011 - 2 oct. 2011 à 22:24

Bonjour
Je tien a m'excuser si je n'ai posté dans le bon topic, mais je n'ai pas trouvé un forum dédie

Je suis novice en programmation, mais pour mon site internet j'aimerai créer une zone d'intervention de 25 km autour de mon domicile.

j'ai trouve ca:

http://google-maps-api-version-2.touraineverte.com/...

ca correspond bien mais j'aimerai soit : au mieux qu'on ai pas a cliquer sur ma ville pour que le rond apparaisse, soitsi ce n'est pas possible, que ma ville soit représenter avec un marquer.

J'ai cherche depuis 10h mais la j'en peu plus je vous demande donc de l'aide..

merci par avance

Si le lien ne marche pas
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xml:lang="fr">
<head>
<title>Touraineverte.com - dessiner tracer un disque</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>

<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAF0TiLSL7jMWlK4_47lYh4hQiwXaTBl6CORReW0Gn4tuS54KkChRloKxiZZlccEtYQ_T2Rpek0n5jtQ"></script>
<script type="text/javascript">
/* Chargement du module "maps" dans sa version "2.x" */
google.load("maps", "2.x",{"other_params":"sensor=false"});
/* Déclaration des variables globales */

var maCarte;
var polygoneCercle;
var centre;
var monMarqueur;

var cercleCouleur = "#0000ff";
var cercleEpaisseur = "1";
var cercleOpacite = ".5";
var disqueCouleur = "#0000ff";
var disqueOpacite = ".1";
var rayon = 25;
var segment = 60;

/* Fonction initialize() */
function initialize() {
/* ... Si le navigateur est compatible avec l'API de Google Maps ... */
if (google.maps.BrowserIsCompatible()) {
/* ... Création d'une nouvelle carte nommée "maCarte" qui s'affichera à l'intérieur de la
ayant pour identifiant id="EmplacementDeMaCarte" ... */
maCarte = new google.maps.Map2(document.getElementById("EmplacementDeMaCarte"));
/* ... Désactivation du double click permettant de zoomer sur la carte ... */
maCarte.disableDoubleClickZoom();
/* ... Ajout à la carte nommée "maCarte" du mini contrôle permettant de zoomer et de déplacer la carte ... */
maCarte.addControl(new google.maps.SmallMapControl());
/* ... Ajout à la carte nommée "maCarte" de l'Echelle ... */
maCarte.addControl(new google.maps.ScaleControl());
/* ... Centre la carte nommée "maCarte" sur la Latitude 47.389982, la Longitude 0.688705, avec un niveau de zoom égal à 9 ... */
maCarte.setCenter(new google.maps.LatLng(48.367427,2.102652), 12);
/* ... Ajout d'un observateur d'événement à la carte nommée "maCarte" ... */
/* ... L'événement observé est le double-click sur la carte nommée "maCarte" ... */
google.maps.Event.addListener(maCarte, "dblclick", function(marker, point) {
/* ... Suppression de tous les recouvrements (le cercle précédemment tracé dans notre cas) de la carte nommée "maCarte" .... */
maCarte.clearOverlays();
/* ... Centre la carte nommée "maCarte" sur le point double-cliqué avec un niveau de zoom actuel de la carte nommée "maCarte" ... */
maCarte.setCenter(point, maCarte.getZoom());
/* ... Création d'un marqueur nommé "monMarqueur" ancré sur le point surlequel on a double cliqué sur la carte ... */
monMarqueur = new google.maps.Marker(point);
/* ... Ajout du marqueur nommé "monMarqueur" sur la carte nommée "maCarte" ... */
maCarte.addOverlay(monMarqueur);
/* ... centre = point ayant pour coordonnées le centre actuel de la carte nommée "maCarte" ... */
centre = maCarte.getCenter();
/* ... Appel de la fonction dessineUnCercle() afin de tracer le cercle... */
dessineUnCercle();
});
/* ... Si le navigateur n'est pas compatible avec l'API de Google Maps ... */
}else{
/* ... affichage du message "Désolé, mais votre navigateur n'est pas compatible avec Google Maps". */
alert('Désolé, mais votre navigateur n\'est pas compatible avec Google Maps');
}
}
/* Fonction dessineUnCercle() */
function dessineUnCercle(){
var latConv = centre.distanceFrom(new google.maps.LatLng(centre.lat()+0.1, centre.lng()))/100;
var lngConv = centre.distanceFrom(new google.maps.LatLng(centre.lat(), centre.lng()+0.1))/100;
/* ... Création d'un tableau nommé "pointsCercle". Celui-ci va contenir tous les points nécessaires ... */
/* ... à la construction du polygone représentant le cercle nommé "polygoneCercle" ... */
var pointsCercle = [];
var step = parseInt(360/segment)||10;
for(var i=0; i<=360; i+=step){
/* ... "pint" : coordonnées d'un point participant à la construction du polygone nommé "polygoneCercle" ... */
var pint = new google.maps.LatLng(centre.lat() + (rayon/latConv * Math.cos(i * Math.PI/180)), centre.lng() + (rayon/lngConv * Math.sin(i * Math.PI/180)));
/* ... Ajout du point "pint" dans le tableau "pointsCercle" ... */
pointsCercle.push(pint);
}
/* ... Création d'un polygone nommé "polygoneCercle" ... */
polygoneCercle = new google.maps.Polygon(pointsCercle, cercleCouleur, cercleEpaisseur, cercleOpacite, disqueCouleur, disqueOpacite);
/* ... on ajoute le polygone nommé "polygoneCercle" à la carte nommée "maCarte". */
/* ... ce polygone représente le cercle tracé sur la carte. ... */
maCarte.addOverlay(polygoneCercle);
}
/* Appelle la fonction "initialize" lorsque la page web sera chargée */
google.setOnLoadCallback(initialize);
</script>
</head>






<noscript>
Attention :

Afin de pouvoir utiliser Google Maps, JavaScript doit être activé.

Or, il semble que JavaScript est désactivé ou qu'il n'est pas supporté par votre navigateur.

Pour afficher Google Maps, activez JavaScript en modifiant les options de votre navigateur, puis essayez à nouveau.

</noscript>

</html>[code]

A voir également:

Api google map et marqueur
Google api map - Conseils pratiques -PHP
C++ map ✓ - Forum C / C++ / C++.NET
Mettre une map en attribut privé d'une classe ✓ - Forum C / C++ / C++.NET
Api google maps javascript ✓ - Forum PHP
Map c++ ✓ - Forum C

1 réponse

Réponse 1 / 1

sourissot123456 Messages postés 2 Date d'inscription dimanche 2 octobre 2011 Statut Membre Dernière intervention 2 octobre 2011
2 oct. 2011 à 22:24

Bon j'ai fini par trouver trouvé si ca interesse quelqu'un voici le code:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xml:lang="fr">
<head>
<title>Touraineverte.com - dessiner tracer un disque</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>

<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAF0TiLSL7jMWlK4_47lYh4hQiwXaTBl6CORReW0Gn4tuS54KkChRloKxiZZlccEtYQ_T2Rpek0n5jtQ"></script>
<script type="text/javascript">
/* Chargement du module "maps" dans sa version "2.x" */
google.load("maps", "2.x",{"other_params":"sensor=false"});
/* Déclaration des variables globales */

var maCarte;
var polygoneCercle;
var centre;
var monMarqueur;

var cercleCouleur = "#0000ff";
var cercleEpaisseur = "1";
var cercleOpacite = ".5";
var disqueCouleur = "#0000ff";
var disqueOpacite = ".1";
var rayon = 25;
var segment = 60;

/* Fonction initialize() */
function initialize() {
//*TC* Si le navigateur est compatible avec l'API de Google Maps ... **//
if (GBrowserIsCompatible()) {

//** ... Création d'une nouvelle carte ayant pour nom 'MaCarte' et qui se situera en lieu et place de la
ayant pour identifiant (id) 'EmplacementDeMacarte' ... **//
MaCarte = new GMap2(document.getElementById('EmplacementDeMaCarte'));

//** ... On supprime le zoom par double clique sur la carte nommée 'MaCarte' ... **//
MaCarte.disableDoubleClickZoom();

//** ... Ajout des contrôles : boutons permettant le déplacement et le zoom et affichage de l'échelle ... **//
MaCarte.addControl(new GSmallMapControl());
MaCarte.addControl(new GScaleControl());

//** ... La carte 'Macarte' est centrée sur la Latitude 47.389982, la Longitude 0.688705, avec un niveau de zoom égal à 9 ... **//
MaCarte.setCenter(new GLatLng(48.367427,2.102652), 10);

//** ... Un observateur d'événement est ajouté à la carte appelé 'MaCarte'. L'évenement détecté est 'dblclick' (Détecte si un double click est effectué sur le marqueur appelé 'marker'). Si un double-click a été effectué sur la carte appelé 'MaCarte', la fonction située entre les {} sera alors executée ... **//
GEvent.addListener(MaCarte, 'dblclick', function(marker, point) {

//** ... Suppression de tous les recouvrements (marqueurs, polyline, info-bulle, etc...) de la carte nommée 'MaCarte' ... **//
MaCarte.clearOverlays();

//** ... On centre la carte nommée 'MaCarte' sur le point 'point', et avec le niveau de zoom actuel de la carte ( MaCarte.getZoom() ) ... **//
//MaCarte.setCenter(point, MaCarte.getZoom());
MaCarte.setCenter(new GLatLng(48.367427,2.102652), 10);

//** ... un nouveau marqueur nommé 'monMarqueur' est créé. Celui est ancré aux coordonnées géographiques du point 'point' représentant le centre du cercle ... **//
monMarqueur = new GMarker(point);

//** ... Affichage du marqueur nommé 'nomMarqueur' sur la carte nommée 'MaCarte' ... **//
MaCarte.addOverlay(monMarqueur);

//** ... la variable 'centre' est égale aux coorconnées géographiques du point central de la carte affichée 'MaCarte' ... **//
centre = MaCarte.getCenter();

//** ... Appel la fonction dessineUnCercle() pour dessiner le cercle. **//
dessineUnCercle();
});

//** Si le navigateur n'est pas compatible avec l'API de Google Maps ... **//
}else{

//** ... affichage du message 'Désolé, mais votre navigateur n'est pas compatible avec Google Maps'. **//
alert('Désolé, mais votre navigateur n\'est pas compatible avec Google Maps');
}
}
/* Fonction dessineUnCercle() */
function dessineUnCercle(){
/*Construction du tableau 'points' contenant toutes les coordonnées des points nécessaires au tracé du cercle **/
var latConv = centre.distanceFrom(new GLatLng(centre.lat()+0.1, centre.lng()))/100;
var lngConv = centre.distanceFrom(new GLatLng(centre.lat(), centre.lng()+0.1))/100;
var points = [];
var step = parseInt(360/segment)||10;
for(var i=0; i<=360; i+=step){
var pint = new GLatLng(centre.lat() + (rayon/latConv * Math.cos(i * Math.PI/180)), centre.lng() + (rayon/lngConv * Math.sin(i * Math.PI/180)));
points.push(pint);
}

//** le cercle 'cercle' est en fait un polygone construit à l'aide des points contenus dans le tableau 'points' **//
cercle = new GPolygon(points, cercleCouleur, cercleEpaisseur, cercleOpacite, disqueCouleur, disqueOpacite);

//** ... Affichage du 'cercle' sur la carte nommée 'MaCarte' ... **//
MaCarte.addOverlay(cercle);;
}
google.setOnLoadCallback(initialize);
</script>
</head>






<noscript>
Attention :

Afin de pouvoir utiliser Google Maps, JavaScript doit être activé.

Or, il semble que JavaScript est désactivé ou qu'il n'est pas supporté par votre navigateur.

Pour afficher Google Maps, activez JavaScript en modifiant les options de votre navigateur, puis essayez à nouveau.

</noscript>

</html>

Pour changer la carte il suffit de changer : GLatLng(48.367427,2.102652), 10) par vos coordonnées google map

Discussions similaires

qu'est ce que c'est que ce map ???

Google maps api mysql J2EE

comment integrer google maps dans un site web

Google Maps API & PHP

Le Mapping en Java: Map(Key,Value)

Votre réponse

Discussions similaires