|
|
|
|
|
LE GEOCODING
 Le geocoding permet de traduire une adresse en coordonnées longitude / latitude, coordonées qui pourra être utilisée par la suite dans les carte Google Maps pour un centrage de carte ou pour placer un marker.
LE GEOCODING (version avec boîte d'entrée)
Cette version est couplée à une boîte d'entrée. L'internaute entrera dans cette boîte l'adresse qu'il souhaite visualiser et un marker situera l'adresse.
Il est fortement conseillé, d'ajouter le nom du pays en anglais (ex. : Belgium).
Ce système ne marche que pour les rues et communes connues par Google Maps !
<html>
<head>
<title>Application Google Maps : Le geocoding</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=
ABQIAAAAFw0lDRKsdCra15LPvIxvehS3Kl_ZRrzIrsFqDz8GBXIeW1O52xQh3P31Xg2eTvqFRAyuOMY4dQrRQw"
type="text/javascript"></script>
<script type="text/javascript">//<![CDATA[
var map = null;
var geocoder = null;
function load()
{
if (GBrowserIsCompatible())
{
map = new GMap2(document.getElementById("carte"));
map.setCenter(new GLatLng(49.8, 2.4), 6);
// Initialisation de l'objet "GClientGeocoder"
geocoder = new GClientGeocoder();
}
}
// Fonction de geocoding.
// Transformation d'une adresse en coordonnées
function showAddress(address)
{
if (geocoder)
{
geocoder.getLatLng(address, function(point)
{
if (!point) {alert(address + " not found");} // Adresse non connue par Google Maps
else
{
map.setCenter(point, 13); // Recentrage de la carte sur l'adresse
var marker = new GMarker(point); // Initialisation d'un marker
map.addOverlay(marker); // Affichage du marker
marker.openInfoWindowHtml(address); // Affichage d'une bulle contenant l'adresse
}
});
}
}
//]]></script>
</head>
<body onload="load()" onunload="GUnload()">
<form action="#" onsubmit="showAddress(this.address.value); return false">
Entrez dans cette boîte l'adresse que vous souhaitez situer<br>
Ajoutez le nom du pays en anglais !!!<br>
<input type="text" size="60" name="address"><input type="submit" value="Recherche !"><br>
Ex d'adresse : <i>14, rue Royale Bruxelles Belgium</i>
</form>
<div id="carte" style="width: 500px; height: 300px"></div>
</body>
</html>
|
Explications :
"geocoder = new GClientGeocoder();" initialise l'objet "GClientGeocoder".
Création d'une fonction "showAddress()" qui fera la convertion de l'adresse en coordonnées longitude/latitude.
Dans cette fonction on recentre la carte, on place un marker et une bulle contenant l'adresse recherchée.
Résultat :
LE GEOCODING (version avec adresse en dur)
Dans cette version l'adresse est écrite en dur dans une variable.
Il est fortement conseillé, d'ajouter le nom du pays en anglais (ex. : Belgium).
Ce système ne marche que pour les rues et communes connues par Google Maps !
<html>
<head>
<title>Application Google Maps : Échelle (scale)</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=
ABQIAAAAFw0lDRKsdCra15LPvIxvehS3Kl_ZRrzIrsFqDz8GBXIeW1O52xQh3P31Xg2eTvqFRAyuOMY4dQrRQw"
type="text/javascript"></script>
<script type="text/javascript">//<![CDATA[
var map = null;
var geocoder = null;
function load()
{
if (GBrowserIsCompatible())
{
map = new GMap2(document.getElementById("carte"));
map.setCenter(new GLatLng(49.8, 2.4), 6);
// Initialisation de l'objet "GClientGeocoder"
geocoder = new GClientGeocoder();
// Initialisation de l'adresse
adresse = "14, rue Royale Bruxelles Belgium";
// Appel de la fonction d'affichage de l'adresse
showAddress(adresse);
}
}
// Fonction de geocoding.
// Transformation d'une adresse en coordonnées
function showAddress(address)
{
if (geocoder)
{
geocoder.getLatLng(address, function(point)
{
if (!point) {alert(address + " not found");} // Adresse non connue par Google Maps
else
{
var marker = new GMarker(point); // Initialisation d'un marker
map.addOverlay(marker); // Affichage du marker
marker.openInfoWindowHtml(address); // Affichage d'une bulle contenant l'adresse
}
});
}
}
//]]></script>
</head>
<body onload="load()" onunload="GUnload()">
<div id="carte" style="width: 500px; height: 300px"></div>
</body>
</html>
|
Explications :
"geocoder = new GClientGeocoder();" initialise l'objet "GClientGeocoder".
La variable "adresse" est chargée par une adresse à afficher.
La fonction "showAddress()" pour afficher l'adresse.
Création d'une fonction "showAddress()" qui fera la convertion de l'adresse en coordonnées longitude/latitude.
Dans cette fonction on place un marker et une bulle contenant l'adresse recherchée.
Dans un site dynamique, la variable "adresse" peut-être personnalisée selon les besoins.
Résultat :
|
|
|
|
