2. Ajoutons quelques contrôles#
Date de publication initiale : 02 novembre 2008
Introduction#
Ce deuxième tutoriel reprend le globe défini dans le premier tutoriel en lui ajoutant des éléments de contrôle.
Initialisation#
Reprendre le globe défini dans le premier tutoriel.
Processus#
Ajouter quelques contrôles à la carte - navigation à la souris, contrôles de zoom et de directions, grille, carte générale et légende :
ge.getOptions().setMouseNavigationEnabled(true);
ge.getNavigationControl().setVisibility(ge.VISIBILITY_SHOW);
ge.getOptions().setGridVisibility(true);
ge.getOptions().setStatusBarVisibility(true);
ge.getOptions().setOverviewMapVisibility(true);
ge.getOptions().setScaleLegendVisibility(true);
Code complet#
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>[Google Earth] 2. Ajoutons quelques contrôles</title>
<script src="http://www.google.com/jsapi?key=ABQIAAAAPo34DyTbdo2RpVUvdvK1qxTVkAM76o12Ue_ZZqmwjROaqOyBLhQVBCYY9lnsLXH3mdZLo-PWW8Z1DQ"></script>
<style type="text/css">
html { overflow:hidden; height:100%; }
body { height:100%; margin:0; }
</style>
<link rel="icon" type="image/png" href="./favicon.png"/>
<script>
google.load("earth", "1");
var ge = null;
function init() {
google.earth.createInstance("map3d", initCallback);
}
function initCallback(object) {
ge = object;
ge.getWindow().setVisibility(true);
ge.getOptions().setMouseNavigationEnabled(true);
ge.getNavigationControl().setVisibility(ge.VISIBILITY_SHOW);
ge.getOptions().setGridVisibility(true);
ge.getOptions().setStatusBarVisibility(true);
ge.getOptions().setOverviewMapVisibility(true);
ge.getOptions().setScaleLegendVisibility(true);
}
</script>
</head>
<body onload='init()' id='body'>
<div id='map3d_container' style='border: 0px solid silver; height: 100%; width: 100%;'>
<div id='map3d' style='height: 100%;'></div>
</div>
</body>
</html>
Démonstration#
Info
Le serveur hébergeant la démonstration n'étant plus disponible depuis de nombreuses années, la démonstration, autre fois intégrée en iFrame est désactivée.
<iframe src="http://88.191.39.115/fabien/geotribu/%5bgeotribu%5d_Google-Earth_tuto2.html" width="100%" height="700px"></iframe>
Remarques#
L'ajout de contrôle et d'informations sur la carte se fait de manière très simple en utilisant les méthodes de l'API. L'API est disponible à cette adresse : http://code.google.com/apis/earth/documentation/reference/index.html
Conclusion#
Ajouter quelques options à la carte est très simple. Maintenant que les options de contrôle et de navigation sont ajoutées à la carte, nous verrons par la suite comment ajouter des informations sur la carte. L'utilisation des boutons de navigation est exactement la même que le logiciel Google Earth - vous ne serez pas perdu.
Auteur·ice#
Fabien Goblet#
Informaticien et géographe de formation, je suis j'étais indépendant en base de données, webmapping, j'aide à la modélisation et à la définition du besoin client, je développe j'encadre le développement des interfaces d'administration et des carto-web, je conçois des api géographiques pour les administrations, les ONG, les labos de recherche. Je suis maintenant responsable de l'innovation chez Sogefi. Toujours des cartes et des données qui ont besoin de communiquer. Nous avons une spécialité dans les données foncières et de leur représentation à destination des administrations.
J'aime comprendre les données et en faire quelquechose ; du coup je fais pas mal de veille techno sur tout ce qui touche aux technologies web de dataviz - carto ou non.
J'ai une préférence pour les technologies libres. Tout ce qui touche aux interactions hommes-machines avec des technos comme Kinect, Arduino, Raspberry, les imprimantes 3d ou les machines de découpe laser, les caméras 360° me passionne. Et j'essaie de les utiliser dans le cadre du travail.
Commentaires
Une version minimale de la syntaxe markdown est acceptée pour la mise en forme des commentaires.
Propulsé par Isso.
Ce contenu est sous licence Creative Commons BY-NC-SA 4.0 International 
