Personnaliser les icônes et controles d'OpenLayers#

Date de publication initiale : 22 décembre 2008

Introduction#

Même si la librairie OpenLayers se veut la plus souple et la plus ouverte possible, certaines parties sont encore codées en dures. C'est le cas notamment pour tout ce qui traite de la customisation.

La nouvelle classe proposée dans ce tutoriel, qui hérite de PanZoom, vous permettra de personnaliser facilement vos controls.

Personnaliser la classe PanZoom#

La première étape consiste à télécharger le fichier "PanZoomCustom" ainsi qu'un pack contenant de nouvelles icônes. Ce pack doit être placé dans le répertoire img d'OpenLayers, le fichier JavaScript doit lui être copier dans le répertoire OpenLayers/Controls.

Exemple d'utilisation#

Vous devez ensuite appeler cette nouvelle classe dans votre page qui affichera votre carte. Cela se passe de la manière suivante :

custom = new OpenLayers.Control.PanZoomCustom({
   imgPanup : "north_blue_square_glossy.png",
   imgPanleft : "west_blue_square_glossy.png",
   imgPanright : "east_blue_square_glossy.png",
   imgPandown : "south_blue_square_glossy.png",
   imgZoomin : "z_plus_blue_square_glossy.png",
   imgZoomworld : "z_world.png",
   imgZoomout : "z_moins_blue_square_glossy.png",
  });
map.addControl(custom);

Par rapport au code d'origine, outre le fait de pouvoir disposer de nouvelles icônes, cette classe apporte une nouvelle action qui permet au survol de la souris de faire un rollover donnant ainsi l'illusion que le bouton est enfoncé.

Ci-dessous voici quelques exemples présentant cette nouvelle classe ainsi que les icônes :

Auteur·ice#

Arnaud Vandecasteele#

Bien qu'issu à l'origine d'un parcours universitaire (doctorat et post-doc), j'ai finalement tenté l'aventure entrepreunariale au travers de Geolab.
Mes principaux centres d'intêrets dans le domaine de la géomatique portent sur les logiciels Open Source et plus particulièrement QGIS.
J'aime également le développement informatique avec une forte préférence à tout ce qui se passe côté serveur (base de données, traitements, etc.). Côté techno, mes choix se portent habituellement sur du (Geo)Django et PostgreSQL/PostGIS.

Pendant mon temps libre, vous me trouverez un GPS à la main afin de contribuer à OpenStreetMap ou sur un tatami en train de pratiquer le Jiu-Jitsu Brésilien.

Si vous êtes intéressé par l'un ou tous ces sujets, n'hésitez pas à me contacter !

Commentaires