## Weballette - Framacarte *Comment créer rapidement une carte interactive et la maintenir à jour ?*  > Cemea - CC-by-SA ---- ## Créer des Framacartes interactives :world_map: -> :bulb: [THE tuto !](https://wiki.cartocite.fr/doku.php?id=umap:tutoriel_umap) : https://wiki.cartocite.fr -> [CE diapo](https://ln.cemea.org/tutocarto) : https://ln.cemea.org/tutocarto --- ## Préambule :newspaper: * Mettre en ligne des données géolocalisées sur une carte * Interactions possibles (pop-up) * Difficultés à maintenir ces données à jour ! * [Un bon exemple](http://u.osmfr.org/m/268418/) *(mais [Ne faites pas ça !](https://framacarte.org/fr/map/carte-du-reseau-national-des-cemea_128560#9/48.6020/1.9799))* > -> [Framacarte](https://framacarte.org) ou [Umap](https://umap.openstreetmap.fr) de [OpenStreetMap](https://openstreetmap.org) --- ## Pré-requis :female-construction-worker: * Données publiées (données personnelles !) * Texte, données numériques, liens, (images) * un compte sur openstreetmap.org (pas personnel = service) -> à partager avec "Projets MAPS Cemea" ---- ### Précautions :warning: * Ne pas créer une carte sans compte : * si perte du lien = perte des infos * sinon tout le monde peut modifier * Données géolocalisées : 2 colonnes : * lon(gitude), lat(itude) * Nouvelles données + relocaliser + réimporter en écrasant * Gestion par couches = **calques** ! --- ### Méthode "Pazapa" :woman-walking: #### 1 : la carte :world_map: 1) Se connecter à [Framacarte](https://framacarte.org) avec un compte [OSM](https://openstreetmap.org) 2) Créer une carte et lui donner un petit nom 3) Créer autant de calques que besoin 4) Partager avec "Projets Maps Cemea" pour colaboration (Permissions -> Editeurs) ---- ### Méthode "Pazapa" :woman-walking: #### 2 : les données :world_map: 1) Données à préparer avec colonnes bien nommées : * adresse, CP, Ville * nom, email, site... 2) Exporter en CSV ( séparateur ",") 3) Se rendre sur : https://adresse.data.gouv.fr/csv 4) Envoyer fichier + ajuster les paramètres 5) Récupérer fichier géocodé en CSV ---- ### Méthode "Pazapa" :woman-walking: #### 3 : les données dans la carte :world_map: 1) Dans la carte, importer (:arrow_up:) les données en "remplaçant les données" dans chaque calque 2) On recommence pour chaque calque ---- ### Méthode "Pazapa" :woman-walking: #### 4 : Personnalisation de carte :world_map: Pour chaque calque : * Propriétés de la forme * *couleur, forme de l'icone, image (ou personnalisée)* * Options d'interactions * Forme de la pop-up : *grande* * Gabarit du contenu : *définir* ---- ### Exemple de Gabarit ! Sensible à la Casse a <> A ```## {Nom} ## {Ville} **Tel** : {telephone} *Contact* : {mail} * [[{site}|Voir le site Web]] ``` * Consulter l'aide pour la mise en forme. ---- ### Et plein d'autres astuces :bulb: [THE tuto !](https://wiki.cartocite.fr/doku.php?id=umap:tutoriel_umap) : https://wiki.cartocite.fr -> **tutoriel uMap complet** :sos: support@cemea.asso.fr