Rechercher dans le blog

Comment personnaliser une basemap dans ArcGIS ? (Découverte du Vector Tile Style Editor)

ArcGIS possède un très grand catalogue de fonds de carte servant de contexte pour vos données dans vos applications cartographiques. Pour une application que vous verrez très bientôt, j'ai besoin d'un fond de carte futuriste. Le fond de carte Nova correspond pas mal à ce que je recherche, mais j'aimerais y ajouter un twist dans un style rétro 80 (ou, pour les connaisseurs une "esthétique synthwave"). Vous voyez de quoi je parle ? Le violet, le bleu, le jaune, le rose, les néons, ce genre de musique... Parfait.
Esri met à disposition l'outil parfait pour mon besoin : l'ArcGIS Vector Tile Style Editor. Dans cet article, je vous propose de découvrir ensemble cette application indispensable pour personnaliser vos basemaps.

Qu'est-ce que l'ArcGIS Vector Tile Style Editor ?

Derrière ce nom à rallonge se cache une application qui vous permet de personnaliser les fonds de carte vectoriels d'Esri. Accessible avec un compte ArcGIS Online, Enterprise ou Dev, vous pouvez vous en servir pour modifier les couleurs, les motifs, la taille et les polices d'écriture des étiquettes... 
En vous connectant, vous verrez toutes les basemaps déjà personnalisées de votre org apparaître. Pour commencer, cliquez sur "Nouveau style" en haut à droite, puis sélectionnez la basemap que vous souhaitez personnaliser. Evidemment, plus le style d'origine se rapproche de ce que vous voulez obtenir, plus ça sera simple par la suite. Pour ma part, je choisis donc Nova.
Avant d'aller plus loin, il nous faut une idée claire de ce que l'on souhaiterait obtenir. Je vous propose donc de sortir quelques minutes de l'app pour ce qui arrive.  

Le Moodboard

Ah oui, mon étape préférée ! Elle n'est pas obligatoire, mais si comme moi vous avez passé votre adolescence à chercher des "aesthetics" sur Pinterest, vous savez à quel point c'est satisfaisant. Pour chacune de mes apps, j'essaye de collecter des références que je compile sur un tableau. J'en extrait ensuite une palette de couleur, dont je pourrai me resservir directement pour ma basemap, la symbologie et les éléments d'interface utilisateur de l'application. Voici par exemple mon ✨moodboard✨ pour l'esthétique synthwave :
Bon, il faut aimer le néon je vous l'accorde (perso j'adore). A nouveau, cette partie est facultative, mais je trouve qu'elle fait gagner énormément de temps par la suite car elle évite d'avancer à l'aveugle dans le choix des couleurs. Si vous êtes sensibles à l'esthétique globale de vos applications, je vous conseille de tester ! Pour ma part, je recherche des images directement dans mon navigateur ou alors sur Pinterest, et je crée mon tableau sur Powerpoint. Très simple donc à mettre en œuvre. 

Mise à jour rapide

Maintenant que nous savons où nous allons, il est temps de passer à la personnalisation de la carte. La mise à jour rapide vous permet de modifier très rapidement les palettes de couleurs des grandes catégories d'occupation du sol. Sur la droite, vous voyez les modifications sur la carte à différentes échelles, ce qui vous permet de mieux vous rendre compte du résultat.
Je commence par modifier les couleurs selon la palette que j'ai établie à la partie précédente. J'active également l'option "Recolorier les icônes et les motifs". Cela va permettre à l'application de recolorer automatiquement les motifs utilisés dans le fond de carte avec des couleurs de votre palette, comme par exemple dans le fond de carte Nova le quadrillage bleu superposé à la carte. Enfin, je modifie également la couleur et le halo des étiquettes et je choisis la police "Avenir Next LT Pro Bold Italic".
En descendant un peu, vous verrez qu'il y a également une option "Masquer toutes les étiquettes", qui peut être très utile si vous avez besoin d'un fond de carte très épuré (dans le cas par exemple où l'étiquetage de vos propres données prend beaucoup de place sur la carte).

Mise à jour des styles de couche

Dans le menu à gauche, vous pouvez sélectionner "Mettre à jour les styles de couche". Ce mode de configuration vous permet de configurer beaucoup plus finement chacune des couches du fond de carte dans les détails. Par exemple, dans la catégorie "Buildings", je vais modifier la couleur du contour (line) pour choisir un rose plus foncé qui rendra les bâtiments plus lisibles.
Pour les frontières ("Boundaries"), je vais modifier la symbologie des frontières entre pays par un motif. Je choisis le motif "Ocean label" qui est déjà existant pour le style Nova. Certains pourraient qualifier ce choix d'hasardeux ou étrange, mais cela crée un effet pailleté sur les frontières qui me plait totalement pour coller à la direction artistique de cette carte. 
Notez que si vous souhaitez modifier une couche en particulier mais que vous n'arrivez pas à la retrouver dans l'arborescence, cliquer sur celle-ci dans la carte vous permettra d'y accéder directement. 

Mise à jour des icônes et motifs 

Juste avant, j'ai utilisé un motif préexistant. Sachez que si nécessaire, vous pouvez ajouter vos propres motifs ou modifier la couleur des motifs existants dans l'onglet "Mettre à jour les icônes et motifs". Vous devrez enregistrer votre fond de carte personnalisé avant d'effectuer des modifications de motifs.  

Encore + d'options

D'autres options s'offrent à vous : mettre à jour la palette de couleurs ou encore mettre à jour directement le JSON. N'hésitez pas à tester plein de choses pour obtenir le fond de plan de vos rêves !

Et ensuite ?

Une fois enregistrée, votre fond de carte personnalisé apparaît en tant que Tile Layer sur votre portail. 
Vous pouvez ensuite l'utiliser comme fond de carte dans le MapViewer par exemple, puis ajouter vos données par-dessus comme avec n'importe sur n'importe quel fond de carte classique. Il sera consommable sans problème par les générateurs d'applications comme Dashboard, Experience Builder etc. Vous pouvez aussi le consommer directement dans des applications personnalisées.
Je me resservirai très bientôt de ce fond de carte pour le développement d'une application web, alors restez connectés !  

Aucun commentaire:

Enregistrer un commentaire