'

Outils pour utilisateurs

Outils du site


doc:openlayersmap

openlayersmap

Si vous utilisez dokuwiki et que vous désirez afficher une carteopenstreetmap sur vos pages, le plugiciel openlayersmap est fait pour vous. Comme son nom l'indique, cet ajout s'appuie sur la bilbliothèque Javascript libre openlayers.

insérer une carte

Après avoir installé le plugiciel, il suffit d'insérer un bloc de texte dans votre page.

<olmap id="olMap" width="800px" height="600px" lat="47.20699" lon="-1.54423" zoom="15" statusbar="1" toolbar="1" controls="1" poihoverstyle="1">
</olmap>
  • id : l'id de la DIV HTML
  • width, height : respectivement largeur, hauteur de la carte
  • lat, lon : respectivement latitude et longitude
  • zoom : niveau de zoom
  • statusbar : afficher la barre de statut
  • toobar : afficher la barre d'outils
  • controls : afficher la barre de contrôle pour de déplacer dans la carte
  • poihoverstyle : affiche les points d'intérêt

Toute les options sont décrites sur la page du plugin.

Le résultat :

mode d'emploi

Plusieurs fonctions sont disponibles dans la carte.

fonctionnement souris/tactile
  • se déplacer en saisissant la carte avec un clic de souris, vous pouvez déplacer la carte
  • vue d'ensemble à l'aide du bouton + en bas à droite de la carte, vous pouvez développer une carte d'ensemble
  • zoom avant et arrière en utilisant les boutons + et - en haut à gauche de la carte, vous pouvez obtenir plus ou moins de détails sur la carte
  • changement de thème ou de carte en cliquant sur l'icône ≡ sur le côté droit de la carte, vous pouvez afficher et sélectionner les cartes et thèmes disponibles
  • récupération d'informations la carte peut contenir des éléments qui contiennent plus d'informations, en cliquant dessus un menu contextuel affichera cette information
  • affichage plein écran à l'aide du bouton ✈, la carte peut être agrandie en affichage plein écran, utilisez le bouton ✕ pour revenir à l'affichage de la page.
fonctionnement clavier

  * déplacement à l'aide des touches fléchées, vous pouvez déplacer la carte   * vue d'ensemble à l'aide du bouton + en bas à droite de la carte, vous pouvez développer une vue d'ensemble   * zoom avant et arrière en utilisant les boutons + et - en haut à gauche de la carte ou en utilisant les touches + et - vous pouvez obtenir plus ou moins de détails dans la carte   * changement de thèmes ou de cartes en cliquant sur l'icône ≡ sur le côté droit de la carte, vous pouvez afficher et sélectionner les cartes et thèmes disponibles   * récupération d'informations la carte peut contenir des éléments qui contiennent plus d'informations, à l'aide de la touche i vous pouvez activer un curseur qui peut être déplacé à l'aide des touches fléchées, en appuyant sur la touche entrée, une récupération d'informations s'exécutera. Appuyez sur la touche i ou la touche Échap pour retourner au mode de navigation   * affichage plein écran à l'aide du bouton ✈, la carte peut être agrandie en affichage plein écran, utilisez le bouton ✕ pour revenir à l'affichage de la page.

Il est possible que certaines des fonctions ou boutons décrits ci-dessus aient été désactivés par l'auteur de la page ou l'administrateur

 

Points d'Intérêts (POI)
id symbole latitude longitude description

Positionner des points

Le plugiciel permet de positionner des marques ou points d'intérêt sur la carte en enrichissant de quelques lignes.

<olmap id="olMap1" width="800px" height="600px" lat="47.20699" lon="-1.54423" zoom="15" statusbar="1" toolbar="1" controls="1" poihoverstyle="1">
47.20699,-1.54423,,1,marker-red.png,
47.20699,lon=-1.54423,90,0.5,photo.png,Mon joli texte
</olmap>

Il faudra insérer une ligne par marque. Chaque ligne contiendra :

latitude, longitude, rotation, opacité, image, texte

La rotation est appliquée à l'image affichée. Cette image est une des images fournies par le plugin dans le répertoire icons (il est possible d'ajouter ces propres images). Le texte sera affiché dans dans une bulle qui apparaît quand on passe la souris sur l'icône.

On remarquera qu'il faut utiliser des id différents (ici olMap et olMap1) sans quoi les 2 cartes s'afficheront à la suite l'une de l'autre.

Le rendu de ces quelques commandes :

mode d'emploi

Plusieurs fonctions sont disponibles dans la carte.

fonctionnement souris/tactile
  • se déplacer en saisissant la carte avec un clic de souris, vous pouvez déplacer la carte
  • vue d'ensemble à l'aide du bouton + en bas à droite de la carte, vous pouvez développer une carte d'ensemble
  • zoom avant et arrière en utilisant les boutons + et - en haut à gauche de la carte, vous pouvez obtenir plus ou moins de détails sur la carte
  • changement de thème ou de carte en cliquant sur l'icône ≡ sur le côté droit de la carte, vous pouvez afficher et sélectionner les cartes et thèmes disponibles
  • récupération d'informations la carte peut contenir des éléments qui contiennent plus d'informations, en cliquant dessus un menu contextuel affichera cette information
  • affichage plein écran à l'aide du bouton ✈, la carte peut être agrandie en affichage plein écran, utilisez le bouton ✕ pour revenir à l'affichage de la page.
fonctionnement clavier

  * déplacement à l'aide des touches fléchées, vous pouvez déplacer la carte   * vue d'ensemble à l'aide du bouton + en bas à droite de la carte, vous pouvez développer une vue d'ensemble   * zoom avant et arrière en utilisant les boutons + et - en haut à gauche de la carte ou en utilisant les touches + et - vous pouvez obtenir plus ou moins de détails dans la carte   * changement de thèmes ou de cartes en cliquant sur l'icône ≡ sur le côté droit de la carte, vous pouvez afficher et sélectionner les cartes et thèmes disponibles   * récupération d'informations la carte peut contenir des éléments qui contiennent plus d'informations, à l'aide de la touche i vous pouvez activer un curseur qui peut être déplacé à l'aide des touches fléchées, en appuyant sur la touche entrée, une récupération d'informations s'exécutera. Appuyez sur la touche i ou la touche Échap pour retourner au mode de navigation   * affichage plein écran à l'aide du bouton ✈, la carte peut être agrandie en affichage plein écran, utilisez le bouton ✕ pour revenir à l'affichage de la page.

Il est possible que certaines des fonctions ou boutons décrits ci-dessus aient été désactivés par l'auteur de la page ou l'administrateur

 

Points d'Intérêts (POI)
id symbole latitude longitude description
1 marker-red 47º12'25.164"N 1º32'39.228"W

Rien

2 photo 47º12'22.608"N 1º32'48.156"W

Mon joli texte

Afficher un itinéraire

Le plugiciel permet d'ajouter un itinéraire au format GPX. Pour cela, le fichier devra préalablement être téléchargé sur le wiki via le gestionnaire de média. Il suffit ensuite de rajouter l'option gpxfile=“monfichier.gpx” (il faudra mettre le chemin omplet vers le fichier ce qui inclus l'espace de nom dans lequel il aura été téléchargé).

Par exemple :

<olmap id="olMap2" width="800px" height="600px" lat="47.20699" lon="-1.54423" zoom="15" statusbar="1" toolbar="1" controls="1" poihoverstyle="1" gpxfile=":doc:941.gpx">
47.20699,-1.54423,45,.7,marker-red.png,Rien
47.20628,-1.54671,,1,photo.png,Mon joli texte
</olmap>

mode d'emploi

Plusieurs fonctions sont disponibles dans la carte.

fonctionnement souris/tactile
  • se déplacer en saisissant la carte avec un clic de souris, vous pouvez déplacer la carte
  • vue d'ensemble à l'aide du bouton + en bas à droite de la carte, vous pouvez développer une carte d'ensemble
  • zoom avant et arrière en utilisant les boutons + et - en haut à gauche de la carte, vous pouvez obtenir plus ou moins de détails sur la carte
  • changement de thème ou de carte en cliquant sur l'icône ≡ sur le côté droit de la carte, vous pouvez afficher et sélectionner les cartes et thèmes disponibles
  • récupération d'informations la carte peut contenir des éléments qui contiennent plus d'informations, en cliquant dessus un menu contextuel affichera cette information
  • affichage plein écran à l'aide du bouton ✈, la carte peut être agrandie en affichage plein écran, utilisez le bouton ✕ pour revenir à l'affichage de la page.
fonctionnement clavier

  * déplacement à l'aide des touches fléchées, vous pouvez déplacer la carte   * vue d'ensemble à l'aide du bouton + en bas à droite de la carte, vous pouvez développer une vue d'ensemble   * zoom avant et arrière en utilisant les boutons + et - en haut à gauche de la carte ou en utilisant les touches + et - vous pouvez obtenir plus ou moins de détails dans la carte   * changement de thèmes ou de cartes en cliquant sur l'icône ≡ sur le côté droit de la carte, vous pouvez afficher et sélectionner les cartes et thèmes disponibles   * récupération d'informations la carte peut contenir des éléments qui contiennent plus d'informations, à l'aide de la touche i vous pouvez activer un curseur qui peut être déplacé à l'aide des touches fléchées, en appuyant sur la touche entrée, une récupération d'informations s'exécutera. Appuyez sur la touche i ou la touche Échap pour retourner au mode de navigation   * affichage plein écran à l'aide du bouton ✈, la carte peut être agrandie en affichage plein écran, utilisez le bouton ✕ pour revenir à l'affichage de la page.

Il est possible que certaines des fonctions ou boutons décrits ci-dessus aient été désactivés par l'auteur de la page ou l'administrateur

 

Points d'Intérêts (POI)
id symbole latitude longitude description
1 marker-red 47º12'25.164"N 1º32'39.228"W

Rien

2 photo 47º12'22.608"N 1º32'48.156"W

Mon joli texte

GPX file Trace GPX GPX track: 941

Afficher des photographies

Le texte affiché dans les infos bulles des marques est mise en forme avec la syntaxe de dokuwiki. Il est donc possible d'afficher des images locales ou distantes.

<olmap id="olMap3" width="800px" height="600px" lat="47.20699" lon="-1.54423" zoom="15" statusbar="1" toolbar="1" controls="1" poihoverstyle="1" gpxfile=":doc:941.gpx">
47.20699,-1.54423,45,.7,marker-red.png,{{http://www.gnu.org/graphics/gnu-head.png?300|Padam}}
47.20628,-1.54671,,1,photo.png,{{:code:peace.jpg?480|Peace}}
</olmap>

mode d'emploi

Plusieurs fonctions sont disponibles dans la carte.

fonctionnement souris/tactile
  • se déplacer en saisissant la carte avec un clic de souris, vous pouvez déplacer la carte
  • vue d'ensemble à l'aide du bouton + en bas à droite de la carte, vous pouvez développer une carte d'ensemble
  • zoom avant et arrière en utilisant les boutons + et - en haut à gauche de la carte, vous pouvez obtenir plus ou moins de détails sur la carte
  • changement de thème ou de carte en cliquant sur l'icône ≡ sur le côté droit de la carte, vous pouvez afficher et sélectionner les cartes et thèmes disponibles
  • récupération d'informations la carte peut contenir des éléments qui contiennent plus d'informations, en cliquant dessus un menu contextuel affichera cette information
  • affichage plein écran à l'aide du bouton ✈, la carte peut être agrandie en affichage plein écran, utilisez le bouton ✕ pour revenir à l'affichage de la page.
fonctionnement clavier

  * déplacement à l'aide des touches fléchées, vous pouvez déplacer la carte   * vue d'ensemble à l'aide du bouton + en bas à droite de la carte, vous pouvez développer une vue d'ensemble   * zoom avant et arrière en utilisant les boutons + et - en haut à gauche de la carte ou en utilisant les touches + et - vous pouvez obtenir plus ou moins de détails dans la carte   * changement de thèmes ou de cartes en cliquant sur l'icône ≡ sur le côté droit de la carte, vous pouvez afficher et sélectionner les cartes et thèmes disponibles   * récupération d'informations la carte peut contenir des éléments qui contiennent plus d'informations, à l'aide de la touche i vous pouvez activer un curseur qui peut être déplacé à l'aide des touches fléchées, en appuyant sur la touche entrée, une récupération d'informations s'exécutera. Appuyez sur la touche i ou la touche Échap pour retourner au mode de navigation   * affichage plein écran à l'aide du bouton ✈, la carte peut être agrandie en affichage plein écran, utilisez le bouton ✕ pour revenir à l'affichage de la page.

Il est possible que certaines des fonctions ou boutons décrits ci-dessus aient été désactivés par l'auteur de la page ou l'administrateur

 

Points d'Intérêts (POI)
id symbole latitude longitude description
1 marker-red 47º12'25.164"N 1º32'39.228"W

|Padam

2 photo 47º12'22.608"N 1º32'48.156"W

Peace

GPX file Trace GPX GPX track: 941

Les 2 photos viennent de Flickr et sont sous licence CC.

doc/openlayersmap.txt · Dernière modification: Le 07/01/2015 à 23:52 (modification externe)