Aide à la création de |
Le référencement dans les moteurs de recherche doit aller jusqu'à la visite du visiteur, la simple visibilité du site ne suffit pas. Les statistiques de google aident à connaître les pages ainsi concernées.
Les icones google maps sont personnalisables, pour des cartes intégrées dans un site web et qui communiquent ainsi d'avantage. Ce code source est utilisable.
Google Webmaster Tools analyse des balises méta des sites en constituant un rapport d'anomalie précieux.
La qualité d'un site peut se voir sur différents niveaux : du graphisme, à la lisibilité du contenu comme des lignes de code ou du référencement.
Carte des sites web de l'annuaire thématique
Comment rendre son site lisible en 800 x 600 comme dans les grandes résolutions avec utilisation des balises div
Utiliser un flux xml pour afficher des données sur une carte Googlemaps
Présentation du service de géolocalisation et cartographie mis en place sur le site
Navigation: Pages Webmaster > Programmation
Le service de cartographie présenté dans l'article Cartographie et Google Maps peut être intégré sur un site web.
Pour se faire il est nécessaire d'obtenir une licence d'utilisation de l'API auprès de google et de l'utiliser pour le répertoire du site web ainsi déclaré. Cette licence se matérialise par une clé.
Le code source de la page qui utilisera l'API devra ainsi contenir votre clé
L'ensemble de la programmation est réalisé en javascript, avec possibilité d'utiliser les balises XML. Le tout peut être intégré dans du php pour pouvoir utiliser les variables. L'ensemble peut également faire l'objet d'url rewriting pour obtenir des url propres.
Au niveau du rendu de la carte google, il est possible de jouer avec les contrôles pour permettre ou interdire, afficher ou non certaines options.
Dans les principaux contrôles, nous trouvons :
- un zoom simple ou avec échelle
map.addControl(new GLargeMapControl());
- le choix dans le type de carte plan, satellite ou mixte
map.setMapType(G_SATELLITE_MAP); // Vue satelite
map.setMapType(G_NORMAL_MAP); // Vue carte
map.setMapType(G_HYBRID_MAP); // Vue mixte
- l'affichage ou non de l'échelle des distances
map.addControl(new GScaleControl()) ;
Dans les autres possibilités
GSmallMapControl() Navigation dans les 4 directions et zoom (+) zoom (-)
GLargeMapControl() Navigation dans les 4 directions et zoom (+) zoom (-) avec echelle
GSmallZoomControl() Les zoom (+) zoom (-) .
L'API permet de modifier des valeurs, mais également de pouvoir les interroger pour récupérer leur statut.
Les principales possibilités unitaires de l'API google maps sont ainsi :
- Affichage de la carte en un point donné
Il s'agit à partir des coordonnées en latitude longitude de centrer la carte sur ce point avec un certain niveau de zoom.
map.setMapType(G_SATELLITE_MAP);
map.setCenter(new GLatLng(2.2944259643554688, 48.85817876694892), 3); //Position sur la Tour Eiffel
- Matérialisation de points sur la carte sous forme d'icônes
Il s'agit d'afficher des icônes sur la carte, avec différentes coordonnées. Les icônes peuvent être distinguées par forme, par couleur.
// Création de mini icones
var icon = new GIcon();
icon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
icon.iconSize = new GSize(12, 20);
icon.shadowSize = new GSize(22, 20);
icon.iconAnchor = new GPoint(6, 20);
icon.infoWindowAnchor = new GPoint(5, 1);
// Fonction de création de points et utilisation des icones
function createMarker(point) {
var marker = new GMarker(point, icon);
return marker;
}
var eiffel = new GPoint(2.2944259643554688, 48.85817876694892);
var marker = createMarker(eiffel);
map.addOverlay(marker);
- Affichage de légende sous forme de bulle de bande dessinée et dont le contenu peut être du texte, ou du code HTML.
Il s'agit d'afficher une bulle d'information lorsque une balise est cliquée (par exemple). Un des plus étant de permettre du HTML et donc d'illustrer le lieu par une image.
// Fonction de création de point avec légende et utilisation des icones
function createMarker(point, legende) {
var marker = new GMarker(point, icon);
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowHtml(legende);
});
return marker;
}
var eiffel = new GPoint(2.2944259643554688, 48.85817876694892);
var marker = createMarker(eiffel, "
La Tour Eiffel");
map.addOverlay(marker);
- Tracage de traits.
Il s'agit de relier par un trait deux points distincts. La couleur, l'épaisseur et l'opacité du trait sont modifiables.
La liste des points pouvant être encodée, c'est un réel service de tracé d'itinérire qu'il est possible de mettre en oeuvre.
var polyline = new GPolyline([
new GLatLng(48.8581, 2.2944),
new GLatLng(48.8681, 2.2844)
], "#FF6600", 10);
map.addOverlay(polyline);
A partir de ces différents éléments et contrôles que l'on peut intégrer avec l'API Google Maps, il est possible de réaliser des fonctions très intéressantes voire de réels services web.
Annuaire thématique cartographié (le 05/12/2007 - 1.871 lectures)
Adapter son site à la résolution d'écran (le 23/11/2007 - 3.185 lectures)
L'API Google Maps Xml et Ajax sont sur un site web (le 19/11/2007 - 2.451 lectures)
Intégrer l'API Google Maps (le 18/01/2006 - 43.728 lectures)
Software 2.0 - Programmation en Java (le 04/04/2005 - 4.404 lectures)
Enfin une explication
Envoyé par
le 18/01/2006
Merci pour ces explication qui permettent de décoder un peu..
coordonnées
Envoyé par
le 18/01/2006
lorsque j'utilise " new GPoint(48.378145469762444, -4.371185302734375)" pour créer une ligne, avec la fonction "new GPolyline" la carte ne restitue pas la bonne localisation, il me faut indiquer long/lat pour obtenir quelque chose de correcte. Quel est mon probleme ?
==> Avec cette localisation là, vous êtes du coté de Brest, exactement à Plougastel-Daoulas (ou son voisinage).
Pour faire un new GPolyline à partir de ce point, il faut centrer la carte sur le Gpoint.
GPolyline
Envoyé par
le 18/01/2006
merci pour ce rapide retour,
j'ai trouvé une solution, si j'utilise "new GPoint" le trait se retrouve sur l'afrique,
var trait1 = new GPolyline([
new GPoint(48.45835188280866, -1.7578125),
new GPoint(30.751277776257812, 24.609375)]," #FF0033",5, 0.5);
map.addOverlay(trait1);
par contre, si j'utilise "GLatLng" c'est correct !
var trait1 = new GPolyline([
new GLatLng(48.45835188280866, -1.7578125),
new GLatLng(30.751277776257812, 24.609375)]," #FF0033",5, 0.5);
map.addOverlay(trait1);
pourquoi lors de l'utilisation de "GPoint" dans "new GPolyline" les coordonées sont elles utilisées Longitude/Latitude ?
encore merci pour vos explications sur l'api de google maps.
reponse
Envoyé par
le 18/01/2006
je viens de trouver ma réponse sur : http://www.econym.demon.co.uk/googlemaps/index.htm
"Le principal changement de la version 2 est que GPoint () n'est plus employé pour identifier un endroit géographique. GPoint () existe toujours, mais il est seulement employé pour indiquer des positions en Pixel sur l'écran. Les endroits géographiques sont indiqués avec le nouvel objet GLatLng (). Les paramètres pour GLatLng () sont dans l'ordre : latitude , longitude. C'est plus exact pour tracer, mais c'est opposée aux paramètres de GPoint (). Tout qui employait GPoint () pour indiquer un endroit géographique maintenant emploie un objet de GLatLng () à la place".
si cela peut servir :)
Existe t-il un service complet en Français ?
Envoyé par
le 18/01/2006
Bonjour, et merci pour ces infos précises. Elles complètent un article sur le même sujet trouvé sur resau.erasme.org.
Question complémentaire : connaîtriez-vous un service "prêt à l'emploi" et en français qui permettrait d'utiliser Google map associé à une base. J'en ai seulement trouvé qu'en anglais (gmapez sur bluweb.com ; frappr.com)
Afficher les marqueurs automatiquement
Envoyé par
le 18/01/2006
Bonjour,
j'aimerais intégrer Google Maps à mon site.
J'aimerais voir tous les casinos en france, comme si j'avais fait une recherche "caisno france" et que je voulais zommer sur certaines régions pour voir où ils se trouvent.
Vos astuces sont très intéressantes merci !