!!! abstract "Ce que nous allons apprendre" - utiliser un compte pour retrouver ses cartes - créer une équipe - partager une carte avec une équipe ## Procédons par étapes Nous avons appris dans [le tutoriel précédent](2-first-map.md) comment créer une carte anonyme contenant un marqueur. Nous allons à présent créer un compte et une équipe. Nota : il n'y a pas de carte anonyme sur [l'instance uMap pour les agents publics ](https://umap.incubateur.anct.gouv.fr/fr/). ### 1. Utiliser un compte **uMap** permet d’associer ses cartes à un compte. Cela présente plusieurs avantages importants par rapport à la création de cartes anonymes : - les cartes créées avec un compte constituent un catalogue permettant d’accéder facilement à ses cartes - on peut modifier chaque carte du catalogue sans avoir besoin de conserver un lien d’édition - on peut gérer ses cartes en équipe et afficher le nom de l'équipe comme auteur - pour les agents publics sur uMap ANCT : une fois connecté avec MonComptePro, on peut utiliser d'autres outils en association avec uMap, comme GRIST. Le logiciel uMap ne gère pas directement de comptes utilisateurs : la gestion des comptes dépend de la configuration du logiciel. #### Pour le grand public, les associations… Sur , vous pouvez utiliser un compte que vous avez ouvert sur un site Web au choix : OpenStreetMap, Github, ou Bitbucket. Si vous n’avez aucun compte sur ces outils, c’est le moment de vous inscrire sur le site www.openstreetmap.org : cliquez **Créer un compte** dans le coin supérieur droit et suivez les instructions - une adresse mail vous sera demandée ([plus d’infos](https://openstreetmap.fr/inscription-openstreetmap)). ![umap_header.png](../../static/tutoriels/3-jutilise-un-compte-et-cree-une-belle-carte/umap_header.png) Cliquez sur **Connexion / Créer un compte** puis sur le pictogramme correspondant au compte que vous souhaitez utiliser. Apparaît alors la page de connexion du site : saisissez le nom d’utilisateur et le mot de passe. La page suivante vous demande d’autoriser l’application uMap à utiliser ce compte : accordez cet accès. Vous retrouvez alors la page d’accueil de uMap, sur laquelle le lien de connexion a laissé la place à un lien **Mes cartes** vous permettant d’accéder à l’ensemble des cartes créées avec ce compte. ![umap_connect.png](../../static/tutoriels/3-jutilise-un-compte-et-cree-une-belle-carte/umap_connect.png) Notez l’URL de la barre d’adresse quand vous consultez votre catalogue de cartes : celle-ci contient le nom de votre compte - par exemple . Vous pouvez l’utiliser pour accéder à votre catalogue de cartes, même sans être connecté à votre compte : vous pouvez diffuser cette URL, les récipiendaires ne pourront pas modifier vos cartes. #### Pour les agents publics 1. Se connectez à MonComptePro : https://moncomptepro.beta.gouv.fr/ Toute personne qui travaille pour un service public y a accès. 2. Créez un compte sur MonComptePro. L'opération prend quelques minutes. 3. Sur [le site uMap pour les agents publics ](https://umap.incubateur.anct.gouv.fr/fr/), cliquez sur Me Connecter. Le tableau de bord s'ouvre, il affiche l'ensemble des cartes que vous créez ainsi que les équipes auxquelles vous participez. ### 2. Créer une équipe #### Pour le grand public, les associations... Une fois connecté sur l'instance uMap d'OSM https://umap.openstreetmap.fr/, cliquer sur "Mon espace", puis "Mes équipes" : ![Equipe-1](https://github.com/user-attachments/assets/703f0b1f-226c-4ac8-ac53-ed66e5557f13) Puis sur "Nouvelle équipe" et renseigner les informations ![Equipe-2](https://github.com/user-attachments/assets/1848690a-5978-465b-bb76-a22430c43be7) Lorsqu'un nouvel utilisateur est associé à une équipe, il voit l'équipe s'afficher sur son tableau de bord, il accède à toutes les cartes qui sont partagées et il peut les modifier. #### Pour les agents publics La fonctionnalité est disponible sous peu. !!!! note Tous les membres d'une équipe partagent les mêmes droits d'édition sur une carte qui est associée à une équipe. Une équipe peut être supprimée, ou son nom modifié en un simple clic. ### 3. Partager une carte avec une équipe Une fois l'équipe créée, il reste encore à donner les droits de modification d'une carte à ses membres. Pour ce faire : ouvrez la carte, puis sur cliquez sur "Editer" et cliquez en haut de page à droite du titre sur "Visibilité : Définir qui peut voir et modifier la carte". ![Equipe-3](https://github.com/user-attachments/assets/70a7dbbb-70ef-49ec-852c-e6aca673ab8c) ----- Placer toute la suite sur le tuto suivant "Dessiner des formes et afficher des étiquettes" !!! abstract "Ce que nous allons apprendre" - Changer la forme, la couleur et le pictogramme d’un marqueur - Créer et modifier une ligne - Contrôler l’affichage des étiquettes Voici comment réaliser une carte contenant de jolis marqueurs et des lignes avec pour exemple la carte de nos vacances au [Camping de la plage Goulien](https://www.openstreetmap.org/way/119055693) sur la Presqu’île de Crozon en Bretagne. ### 3. Créer un joli marqueur Commençons par créer une carte : donnons-lui un nom, définissons une emprise et ajoutons un marqueur à [l’emplacement du camping](http://www.openstreetmap.org/?mlat=48.2387&mlon=-4.5434#map=16/48.2387/-4.5434). Nous avons vu dans [le tutoriel précédent](2-first-map.md) comment effectuer ces opérations. ![umap_marqueur_props.png](../../static/tutoriels/3-jutilise-un-compte-et-cree-une-belle-carte/umap_marqueur_props.png) Ce gros marqueur bleu n’est pas très explicite pour figurer un camping. Remédions à cela. Dans le panneau latéral visible lorsqu’un marqueur est sélectionné, le menu **Propriétés de la forme** permet de modifier l’apparence du marqueur : - **Couleur** : cliquer sur `définir` permet de choisir une couleur. Notez que vous pouvez définir une couleur par [son nom CSS](http://www.w3schools.com/cssref/css_colors.asp) ou par son code héxadécimal, que vous pouvez choisir par exemple avec ce [sélecteur de couleurs](http://htmlcolorcodes.com/fr/selecteur-de-couleur/). - **Forme de l’icône** : le choix `Par défaut` correspond au marqueur actuel, les autres choix sont Cercle, Goutte et Épingle. - **Image de l’icône** : cliquer sur `définir` pour choisir parmi une centaine de pictogrammes. Notez que le picto n’est affiché que pour les formes d’icônes `Par défaut` et `Goutte`. Voici le marqueur obtenu avec les propriétés ci-contre : ![umap_camping.png](../../static/tutoriels/3-jutilise-un-compte-et-cree-une-belle-carte/umap_camping.png) #### Modifier un marqueur ![umap_modifier_marqueur.png](../../static/tutoriels/3-jutilise-un-compte-et-cree-une-belle-carte/umap_modifier_marqueur.png) Pour modifier un marqueur de la carte, plusieurs possibilités s’offrent à vous : - un clic sur le marqueur vous permet soit d’afficher le panneau d’édition (stylo), soit de supprimer le marqueur (corbeille) - **shift-clic** est un raccourci qui affiche directement le panneau d’édition - un glisser-déposer vous permet de déplacer le marqueur sur la carte ### 3. Créer une ligne Le premier jour de vacances nous allons en kayak de mer jusqu’à la Pointe de Dinan à l’ouest de la plage de Goulien. Traçons l’itinéraire suivi. Bouton de dessin d’une ligne. Le bouton **Dessiner une ligne** permet de tracer, point par point, une ligne constiutée de plusieurs segments. Cliquez à nouveau sur le dernier point tracé pour terminer la ligne : apparaît alors à droite un panneau permettant de donner un nom et une description à la ligne, comme pour les marqueurs. #### Modifier une ligne A tout moment vous pouvez sélectionner une ligne en double-cliquant dessus. Vous pouvez alors éditer ses propriétés dans le panneau latéral, ou modifier son tracé sur la carte : - **supprimer un point** de la ligne, matérialisé par un carré blanc, en cliquant dessus - **déplacer un point** par un glisser-déposer - **insérer un point** en cliquant sur un carré gris se trouvant au milieu de chaque segment - **allonger la ligne** avec un Ctrl-Clic lorsque le curseur est placé sur le premier ou dernier point - **couper la ligne** en deux : Clic droit sur un point puis choisir l’option `Scinder la ligne` ![umap_ligne.jpg](../../static/tutoriels/3-jutilise-un-compte-et-cree-une-belle-carte/umap_ligne.jpg) #### Propriétés d’une ligne ![umap_ligne_props.png](../../static/tutoriels/3-jutilise-un-compte-et-cree-une-belle-carte/umap_ligne_props.png) Les propriétés d’une ligne permettent de définir sa couleur et d’autres paramètres définissant son *style* : - l’**opacité** va de transparent à gauche à totalement opaque à droite. Plus le trait est épais plus il peut être transparent. - l’**épaisseur** est définie en pixels, sa valeur par défaut est 3 : glisser le curseur vers la droite pour un trait plus épais (qui sera plus facile à sélectionner). Les **propriétés avancées** permettent de : - **simplifier** le tracé permet de réduire le nombre de points pour l’adapter au niveau de zoom. Il est en général inutile de simplifier un tracé réalisé *à la main*. - définir un **traitillé**, par une série de chiffres séparés par des virgules : longueur (en pixels) visible, longueur invisible, longueur visible, etc. L’épaisseur du trait doit être prise en compte : plus les traits sont épais plus les intervalles doivent être grands. Voici le style de trait obtenu avec les propriétés ci-contre : ![umap_ligne_tirets.png](../../static/tutoriels/3-jutilise-un-compte-et-cree-une-belle-carte/umap_ligne_tirets.png) ### 4. Ajouter des étiquettes ![etiquettes.png](../../static/tutoriels/3-jutilise-un-compte-et-cree-une-belle-carte/etiquettes.png) Pour aider l’identification des différents éléments de notre carte, nous pouvons leur associer une étiquette. L’onglet **Options d’interaction** permet de contrôler l’affichage d’une étiquette associée à chaque élément : - **Afficher une étiquette** active son affichage, elle est alors placée automatiquement - **Direction de l’étiquette** vous permet de fixer la position, à droite ou à gauche de l’élément, ou encore au-dessus ou en-dessous - **Afficher seulement au survol** de la souris est une option intéressante si la carte est dense : afficher toutes les étiquettes surchagerait la carte - **Étiquette cliquable** permet d’afficher l’infobulle correspondante si l’utilisateur clique sur l’étiquette, et non seulement en cas de clic sur la *géométrie* de l’élément. ## Faisons le point Notre deuxième carte est déjà plus intéressante que la première, et nous savons la retrouver facilement. Nous avons vu comment créer, *styliser* et modifier points et lignes. Nous n’avons pas traité ici des polygones, qui représentent des surfaces. Certaines fonctionnalités propres aux polygones méritent d’être détaillées, ce que nous ferons dans le tutoriel [Le cas des polygones](8-polygons.md). Pour le moment voyons comment nous pouvons davantage [personnaliser notre carte](4-customize-map.md). ??? info "Licence" Travail initié par Antoine Riche sur [Carto’Cité](https://wiki.cartocite.fr/doku.php?id=umap:3_-_j_utilise_un_compte_et_cree_une_belle_carte) sous licence [CC-BY-SA 4](https://creativecommons.org/licenses/by-sa/4.0/deed.fr).