Plugin image-map des départements

Un plugin pour afficher la carte de France des départements en image-map (image réactive)

Ce plugin propose un modèle pour afficher une carte de France des départements en image réactive

Voir cet exemple http://galactron.org/Utilisation-du...

Voici le fond de carte utilisé

Installation

Pour récupérer les fichiers de ce plugin vous pouvez :

  • soit utiliser les listes d’installation de /plugins/auto dans la page de gestion des plugins de votre SPIP
  • soit récupérer la version svn ( version de développement ) sur la zone spip :
    svn co svn ://zone.spip.org/spip-zone/_plugins_/imagemap_departements
  • soit télécharger le zip de la dernière version sur https://files.spip.net/spip-zone/

Pour l’installation et l’activation, suivez la procédure standard : cf la documentation officielle

Lors de l’installation il sera créé dans votre base de données une table supplémentaire spip_imap_departements dans laquelle les données des 95 départements métropolitains seront intégrées.

Utilisation

L’ajout de la carte réactive dans un article ou un squelette se fait en utilisant un modèle SPIP : pour plus de précision sur leur fonctionnement, voir la page de documentation des modèles.

Le modèle departements.html mis à disposition dans ce plugin peut donc être appelé :

  • soit dans un article : <departements|parametre1=X|parametre2=Y...>
  • soit dans un squelette : [(#MODELE{departements, parametre1=X, parametre2=Y, ...})]

Ce modèle propose les paramètres suivants :

  • |redim=...  : le facteur de redimensionnement de la carte (par defaut = 1, ce qui correspond a une carte de 479x434 pixels). Pour une carte plus grande donner une valeur supérieure à 1, pour réduire la taille de la carte donner une valeur inférieure. (NB : les valeurs non-entière peuvent êtres passées indifféremment avec une virgule ou un point comme séparateur)
    Exemples : |redim=0.8 pour une carte réduite à 80% de sa taille par défaut, ou |redim=2 pour doubler la taille de la carte
  • |lien_base=... : l’url des liens sur les départements. Par défaut cette url sera celle de la page en cours (appel de la balise #SELF).
    Exemples : |lien_base=toto.html enverra vers la page toto.html lorsque l’on cliquera sur un département, |lien_base=spip.php ?page=contact permet d’envoyer vers la page contact.html de votre SPIP
  • |lien_param=... : le paramètre de l’url qui passe le numéro de département. Par défaut ce paramètre est depart=..., ce qui donne comme url du lien sur les Bouches du Rhône (si on place ce modèle dans l’article n°123) : .../spip.php ?article123&depart=13.
    Exemple : |lien_param=num donnera des url de liens du style .../spip.php ?article123&num=13
  • |param=nom : permet de passer le nom du département à la place du numéro comme valeur du paramètre |lien_param. On obtient donc par exemple : spip.php ?article123&depart=seine-et-marne à la place de spip.php ?article123&depart=77 (c’est la balise #NOM_WEB qui est utilisée, cf partie « Personnalisations »)
  • |mono=1 : par défaut la carte utilisée est en couleurs, ce paramètre permet d’utiliser une version de la carte en mono-teinte.
  • |aff_region=1 si on souhaite afficher la région en plus du nom du département dans l’info-bulle qui apparait au survol d’un département
  • |bullehtml=1 : par défaut l’info-bulle utilisée est générée par un script JavaScript (Cluetip de jQuery) qui ne permet pas son affichage lors de la navigation au clavier (= pas accessible pour les navigateurs vocaux par exemples). Cette option permet d’utiliser l’info-bulle native HTML qui elle apparait lors de la navigation au clavier.

Personnalisations

Ce plugin est essentiellement fait pour fournir un « fond de carte » à partir duquel on va pouvoir ajouter des données concernant les différents départements.

Les données intégrées lors de l’installation du plugin permettent de disposer des balises suivantes :

  • #NUM_DEPARTEMENT : le numéro du département
  • #NOM : son nom
  • #REGION : sa région de rattachement
  • #NOM_WEB : son nom modifié pour pouvoir être utilisé dans une URL (suppression des accents et des guillemets, remplacement des espaces par un tiret)
  • #COORDONNEES : les coordonnées de l'<area> HTML du département pour la carte à sa taille "par défaut"

Pour personnaliser ce modèle procédez comme pour n’importe quel fichier de squelette : une copie dans le répertoire /squelettes/modeles du fichier imagemap_departements/modeles/departements.html vous permettra de réaliser toutes les bidouilles que vous souhaitez en matière de données à afficher.

Pour ce qui est des infos-bulles, de nombreux paramètres d’affichages sont disponibles :
voir la documentation du plugin jQuery Cluetip

Chaleureux remerciements à Lionel Delvarre (http://www.lion1906.com/) pour avoir bien voulu diffuser sa carte de France avec son image-map sous licence GPL.

Discussion

22 discussions

  • Bonsoir,
    merci pour ce plugin (utilisé sous Spip 3.2.19) que j’ai voulu lié à l’arbre généalogique que je gère. J’ai donc adapté (« bidouillé ») le modèle.

    Pour réaliser cette association, j’ai dû ajouter un champ à la table imap_departements.csv et j’ai donc dû modifier en conséquences deux fichiers du plugin. En généalogie, les lieux peuvent être n’importe où dans le monde et ont donc leur propre code (id plutôt). D’où une question, ce « champ personnalisé » ne pourrait-il pas être prévu afin de ne pas avoir à toucher au code du plugin ?

    Il pourrait bien y avoir une autre piste en utilisant une table de liaisons mais je n’ai jamais fait et je ne maîtrise pas (pas encore...).

    Voici le lien pour voir le résultat : https://www.lorand.org/spip.php?article3337

    Répondre à ce message

  • 1
    Bladier26

    Bjr,

    |lien_param=

    renvoie

    #NUM_DEPARTEMENT

    Pour correspondre à ma base, j’aimerais que les #NUM_DEPARTEMENT inférieurs à 10 soient débarrassés de leur zéro à gauche.
    Comment faire ?
    Si j’utilise |replace ça utilise automatiquement depart=

    <departements|mono=1|redim=0.75|[(lien_param|replace{0\\d,\\d}|replace{2A,20A}|replace{2B,20B})]=dpt_id|lien_base=spip.php?page=article&id_article=18>

    Merci de votre aide

    • Bladier26

      Je fournis une solution pour ceux que ça intéresse :

      J’ai « tout simplement (...) » créé une fonction
      <?php function filtre_spip_sprintf($symbol){ return sprintf("%'.02d\n", $symbol); } ?>
      que j’utilse comme ceci :
      [(#SYMBOL|spip_sprintf)]

    Répondre à ce message

  • Bladier26

    Pas fort en javascript...
    Y a-t-il moyen d’obtenir le ToolTip avec, en plus du N° de Département comme titre :

    title="#NUM_DEPARTEMENT[(#BULLEHTML|!={1}|oui)|][(#AFF_REGION|=={1}|oui)[[(#BULLEHTML|=={1}|oui)- ](#NUM_DEPARTEMENT)]]"

    le nom du Dépt

    #NOM

    dans la partie blanche ?

    Répondre à ce message

  • 1
    Bladier26

    Bjr,

    Je n’arrive tout simplement pas à trouver la méthode me permettant de centrer la carte dans ma page.

    Une idée ?
    Merci

    • Bladier26

      Trouvé, si ça peut aider.

      Dans la

      j’ai ajouté
       margin-left: auto; margin-right: auto;
      <div style="width: [(#REDIM|replace{',','.'}|sinon{1}|mult{479}|plus{30}|round)]px; height: [(#REDIM|replace{',','.'}|sinon{1}|mult{434}|plus{15}|round)]px; padding: 0; margin-left: auto; margin-right: auto;">

    Répondre à ce message

  • 1

    Bonjour
    je suis en train de basculer le site de la Fédération ... ancienne version spip V3.0.24 sur spip V4.04
    je m’aperçois que le Plugin image-map des départements n’est pas compatible en V3.213 ni en v4 04
    Y a-t-il possibilité de le rendre compatible ?
    dans la négative cela sera vraiment très problématique pour mon site
    merci d’avance du retour
    cordialement

    Répondre à ce message

  • 1

    Bonjour,
    lorsque j’installe de manière « classique » le plugin avec le code suivant dans une page :

    [(#MODELE{departements}{aff_region=1})]

    Il n’y a que le département de l’Ain qui fonctionne. Avez-vous une idée du problème ?

    Merci, par avance.

    • Chez moi ça marche mais il y a peut-être plus simple, et mieux.

      Ma version de SPIP : 3.2.8
      Dans la configuration des URLs : URLs Objets HTML après avoir mis le htaccess qui va bien à la racine.

      Dans le fichier departements.html à mettre dans squelettes/modeles/ à la ligne 33
      href="#ID_ARTICLE[(#NUM_DEPARTEMENT)]"

      et dans le texte explicatif d’une rubrique
      <div align="center"><departements|redim=0.65|mono=0|bullehtml=0|aff_region=1|lien_base=num.html></div>

      J’ai créé une série d’articles (116), un par département, (pfff) articles qui pourront éventuellement être redirigés vers une page région ou autre.
      Sur le serveur, version php 7.3, dans la base de données mysql, via phpMyAdmin, dans la table spip_imap_departements, dans colonne, parcourir, dans le champ num_departement, j’ai renommé les numéros avec ceux qui correspondent aux numéros d’articles. (116) (re-pfff)
      Tant qu’il n’y a pas de numéro d’article qui correspond à un numéro de département ça ne peut évidemment pas fonctionner.
      Si quelqu’un a une (ou des) solution(s) moins fastidieuse(s), je suis preneur.

    Répondre à ce message

  • Bonjour,
    Il y a quelque chose que je n’ai certainement pas compris ou ce plugin ne convient pas à mon souhait !?...
    Je souhaiterai que quand je clique sur un département cela m’amène sur une page spécifique, et sur un autre sur une autre page et ainsi de suite... et que dans l’infobulle soit noter une information particulière à chaque département.
    Par exemple si je clique sur la Loire-Atlantique (44) dans l’infobulle soit marquée « Hôtel du département » et que j’arrive sur la page https://www.loire-atlantique.fr/44/ puis si je clique sur les Côtes-d’Armor (22) dans l’infobulle soit marqué « C’est ici que j’ai passé mes vacances cette année » et m’envoie sur la page https://www.tohapi.fr/bretagne/camping-mer-baie-kernic.php.
    Pouvez-vous me donner la syntaxe à mettre dans mon article SVP (ou me dire de passer mon chemin...).
    Cerise sur le gâteau : Que seuls les départements qui possède une information soient en couleur (ou d’une couleur différente...).
    Merci pour votre aide.
    Patrice

    Répondre à ce message

  • Bonjour,

    L’installation de la version 0.2.2 se passe bien (SPIP 3.1.0), mais y après j’ai l’erreur L’opération a échoué.

    Cordialement,

    Répondre à ce message

  • Bonjour
    Superbe plugin merci, juste un soucis avec Val-d’oise, il ne comprends pas l’url, j’ai ça ===>
    Val-d%26%238217%3Boise. C’est donc l’apostrophe qui pose probleme.
    Avez vous une piste ?
    Merci à vous de vos lumières

    Répondre à ce message

  • 2

    Bonjour,

    J’ai un problème à l’installation :
    la table « spip_imap_departements » ne se créée pas...
    Du coup, ça marche beaucoup moins bien ;-)

    J’ai du faire une erreur quelque part...

    Peut-être le fait que mes tables ne sont pas préfixées « spip » ?

    Je m’interroge...

    La carte apparaît mais seul le département de l’Ain semble réactif...

    Merci de votre aide

    • J’ai trouvé, j’étais en SQLite... Ca marche mieux en Mysql...

      Autre problème je voudrais qu’au clis sur un dpt on accède à un page : dptxx.html.
      J’ai du mal avec la syntaxe du « xx ».

      Je suis dans un article et j’écris :

      <departements|mono=1|redim=0,8|lien_param=dpt_id|lien_base=dpt#NUM_DEPARTEMENT>
      et plein d’autre variantes mais pas sans succès...

      Je cherche à obtenir un lien du type « dpt01.html »

    • J’ai réussi en modifiant HTML dans le modèle...

      C’est fou ! Quand on décrit le problème pour qu’il soit compréhensible par les autres, la solution s’impose d’elle même.

      Merci pour tout et bravo pour le plugin.

      Je vais maintenant essayer de l’adapter pour qu’il soit responsive...

      L’aventure continue...

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom