Plugin WordPress « Openlayers Shortcode »

Ce plugin WordPress met à votre disposition un nouveau shortcode qui vous permet d’intégrer une ou plusieurs cartes OpenLayers à vos pages et articles WordPress. Ces cartes s’appuient sur plusieurs fonds de carte (OpenStreetMap, OpenCycleMap, OpenPisteMap, MapQuest, Stamen, MapBox, Bing Maps, Google Maps). Sur ces cartes, vous pouvez faire apparaitre un ou plusieurs objets géographiques (points, lignes ou polygones). Pour fonctionner, le plugin embarque les librairies Openlayers (2.12), Wax (6.4.0) et apelle Google Maps (3.x).

TÉLÉCHARGEMENT DU PLUGIN

Pour utiliser ce plugin, vous devez télécharger le fichier ZIP suivant :

Télécharger le plugin Openlayers Shortcode (v2.2.0 – 27/04/13)

Une fois que vous aurez téléchargé le fichier ZIP, ne le dézippez pas. Connectez-vous à votre interface d’administration WordPress. Dans le menu principal, cliquez sur « Extensions », puis sur « Ajouter ». Cliquez alors sur l’onglet « Envoyer ». Vous arrivez sur une page vous permettant d’uploader le fichier ZIP. Cliquez sur « Installer maintenant » et WordPress se charge du reste : il dézippera le fichier et installera l’extension qu’il aura trouvée dans le fichier ZIP ! Retournez dans « Extensions », vous devriez voir l’extension Openlayers Shortcode. Si ce n’est pas encore le cas, activez-la !

CODE-SOURCE ET MODES D’EMPLOI

Le code-source et les modes d’emploi (fichiers README.md, HOWTO.md et ATTRIBUTES.md) sont désormais hébergés et consultables sur la plateforme GitHub :

Consulter le dépôt public « openlayers_shortcode »

Cela étant dit, tout le code-source et les modes d’emploi sont aussi dans le fichier ZIP à télécharger…

EXEMPLES D’UTILISATION

Seuls deux attributs sont nécessaires pour l’exemple le plus simple, un point :

[openlayers lat="48.85300" long="2.35000"]

Si vous le désirez, vous pouvez rajouter une étiquette à votre objet :

[openlayers lat="48.85300" long="2.35000" label="N-D. de Paris"]

 

Apparence de vos figurés

Vous avez aussi la possibilité de personnaliser l’apparence de vos figurés, en modifiant par exemple sa taille ou sa couleur de remplissage :

[openlayers lat="48.85300" long="2.35000" pointradius="15" fillcolor="red"]

 

Bien d’autres paramètres sont modifiables (taille, couleur et opacité des bordures et des remplissages, police et taille pour les textes)

Plusieurs cartes dans une même page

Si vous désirez insérer plusieurs cartes dans votre page, vous devrez les numéroter :

[openlayers id="1" lat="48.85300" long="2.35000" label="N-D. de Paris"]
[openlayers id="2" lat="48.85824" long="2.29456" label="Tour Eiffel"]

Parcourir les champs personnalisés de tous les posts/pages

Vous pouvez aussi cartographier des points à partir de champs personnalisés. L’exemple suivant va parcourir toutes les pages et tous les articles (all) et dessiner un point pour chacun d’entre eux en se basant sur vos champs personnalisés latitude et longitude :

[openlayers mode="all" champ_lat="latitude" champ_long="longitude"]

Vous pouvez aussi utiliser le format WKT pour représenter vos points, lignes et polygones, soit en indiquant le WKT brut, soit en indiquant le champ personnalisé qui contient le WKT :

[openlayers wkt="POLYGON(...)"]

[openlayers mode="posts" champ_wkt="wkt"]

 

Utilisation de fichier distants (formats GML ou GeoJSON)

Vous pouvez aussi demander au shortcode de charger un fichier, soit en indiquant l’URL brute, soit en indiquant le champ personnalisé qui contient l’URL. Exemple avec un fichier GeoJSON projeté en WGS84 (EPSG:4326) :

[openlayers url="http://.../unites_urbaines_rpc.geojson" fillopacity="0.4" fillcolor="purple" strokeopacity="0" center_lat="46.7" center_long="0.3" zoom="9" proj="4326"]

 

Nouvel exemple, avec cette fois-ci un fichier GML, non reprojeté car déjà projeté initialement en Spherical Mercator (EPSG:3857) :

[openlayers url="http://.../stations_metro.gml" pointradius="4" fillcolor="#689d71" strokewidth="2" strokecolor="white" center_lat="6252295" center_long="260983" zoom="12" tiles="google" tiles_layer="aerial"]

 

Dernier exemple, avec un fichier CSV contenant les coordonnées de points (WGS84) :

[openlayers csv="./.../lycees_fr.csv" champ_lat="6" champ_long="7" proj="4326" strokecolor="white" strokewidth="0.5" pointradius="3" tiles="bing" tiles_key="pLeAs3_g3t_YoUr_0wN_k3y" tiles_layer="aerial"]

 

Cette fonctionnalité est en cours d’amélioration. Elle n’est pas encore disponible pour le grand public !

Utilisation des différents fonds de carte (OSM, MapQuest, Stamen, MapBox, Bing Maps, Google Maps)

Outre les fonds de carte OpenStreetMap classique (« osm », « mapquest » et « mapquest_aerial »), deux autres couches plus originales sont disponibles, à savoir la couche « Public Transport » d’OpenCycleMap et la couche du relief par OpenPisteMap :

[openlayers lat="48.85300" long="2.35000" tiles="transport"]

 

[openlayers lat="48.85300" long="2.35000" tiles="hillshade"]

Si vous êtes un utilisateur de la plateforme MapBox, il vous est possible d’utiliser un fond de carte personnel qui serait hébergé chez eux :

[openlayers lat="48.85300" long="2.35000" tiles="mapbox" tiles_url="http://a.tiles.mapbox.com/v3/adrienvh.map-xxxxxxxx.jsonp"]

 

Il est aussi possible d’utiliser les fonds de carte Bing Maps, à condition d’avoir demandée une clef de licence (valable pour un nom de domaine seulement) :

[openlayers lat="48.85300" long="2.35000" tiles="bing" tiles_key="pLeAs3_g3t_YoUr_0wN_k3y" tiles_layer="road"]

 

Autre exemple, avec le fond de carte « aerial » de Bing :

[openlayers lat="48.85300" long="2.35000" tiles="bing" tiles_key="pLeAs3_g3t_YoUr_0wN_k3y" tiles_layer="aerial"]

 

Pour les fonds de carte Google Maps, c’est plus simple car il n’y a pas besoin d’avoir de licence (tant qu’il n’y a pas trop de visites sur votre site) :

[openlayers lat="48.85300" long="2.35000" tiles="google" tiles_layer="road"]

 

Même chose pour les deux fonds de carte « Toner » et « Watercolor » de Stamen Design, pas besoin d’avoir de licence :

[openlayers lat="48.85300" long="2.35000" tiles="stamen" tiles_layer="toner"]

 

[openlayers lat="48.85300" long="2.35000" tiles="stamen" tiles_layer="watercolor"]