Le blog francophone consacré
aux technologies Esri

La version 4.18 de l'API JavaScript ArcGIS est disponible

Vous l'aurez constaté ces dernières semaines, l'année 2020 se termine sur un rythme très soutenu en termes de sorties et de mises à jour des différentes applications ArcGIS. Last but not least, Esri vient de mettre en ligne la version 4.18 de l'API JavaScript ArcGIS. Cette API est une pierre angulaire de l'édifice ArcGIS. D'une part parce qu'elle permet aux développeurs de construire des applications cartographiques riches et puissantes. D'autre part parce que de nombreux composants du système ArcGIS reposent sur cette API: les visionneuses 2D/3D et les apps configurables du portail, ArcGIS Dashboards, ArcGIS Web AppBuilder, ArcGIS Experience Builder, ArcGIS Hub, ArcGIS Urban, ArcGIS Indoors web, ArcGIS for Office, ... 


L'équipe de développement de l'API a fait un travail magnifique durant toute cette période de confinement pour innover et apporter de nombreuses améliorations qui changeront véritablement les ambitions de vos applications web 2D et 3D. L'API JavaScript ArcGIS propose sans conteste la plus riche et la plus moderne API JavaScript dans le monde du Geospatial. 
Je vous propose de jeter un coup d'œil à certaines nouvelles capacités que vous pouvez désormais intégrer à vos applications…


Modules ECMAScript (beta)


Si vous utilisez l'API ArcGIS pour JavaScript avec un framework tel que Angular ou React ou si vous créez des builds personnalisées de l'API, ce processus est devenu plus simple. Les modules ES sont désormais une nouvelle option pour consommer l'API. Ils permettent l'écriture d'un code simplifié et une intégration transparente avec les frameworks et les outils modernes de build. 

Pour commencer, vous installerez un nouveau package NPM @arcgis/core, puis vous pourrez utiliser des imports natifs comme ceci:


Pour plus d'infos, vous consulterez la rubrique suivante du guide sur les modules ES pour connaître les étapes complètes nécessaires à l'utilisation de ces modules de l'API. Il existe également des exemples d'applications disponibles qui illustrent les concepts de base pour l'intégration des modules avec divers frameworks et outils.

Dois-je migrer vers des modules ES ?

Si vous ne vous intégrez pas à des frameworks ou ne créez pas de builds personnalisées de l'API, il n'est pas nécessaire de migrer vers les nouveaux modules ES. Les modules AMD (qui constituent la manière alternative et originale de consommer l'API) continueront d'être disponibles aux côtés des modules ES dans le futur. Les deux formats ont les mêmes capacités car ils sont construits à partir de la même base de code.

Vous pourrez consulter la rubrique Présentation des outils pour apprendre à utiliser ces nouveaux modules et savoir si vous devez ou pas les utiliser.


Interroger les entités regroupées (en clusters)

Vous pouvez dorénavant interroger des entités regroupées dynamiquement en clusters afin d'accéder aux entités sous-jacentes. Cela vous permet d'effectuer les opérations suivantes:
  1. Interrogez les statistiques des entités en cluster.
  2. Affichez l'étendue visible des entités d'un cluster.
  3. Calculez et affichez l'enveloppe convexe (convex hull) des entités regroupées.
  4. Affichez la véritable positions des entités appartenant à un cluster.


Effets de couche

Vous pouvez désormais appliquer des effets à toutes les couches des MapViews 2D, soit aux entités qui répondent aux critères de filtre, soit à l'ensemble de la couche. Cette fonctionnalité puissante vous permet d'appliquer des fonctions similaires aux filtres css sur les couches de vos carte pour améliorer leur qualité cartographique.

L'application d'un effet de manière sélective sur des critères de filtre à l'aide de la classe FeatureEffect a  été proposée à partir de la version 4.11. Cette version 4.18 introduit la possibilité d'appliquer un effet sur une couche entière et propose de nouveaux types d'effets: bloom, drop-shadow et blur:

Blur

L'effet Blur applique un flou gaussien à la couche et donne un aspect flou. Une utilisation classique consistera à adoucir une couche sous une couche de référence, ou d'autres couches importantes, de sorte que les caractéristiques au-dessus puissent se démarquer plus clairement. Vous pouvez également l'utiliser pour visualiser l'incertitude des limites non discrètes telles que les limites d'habitat.


Ces cartes montrent les aires d'habitat historiques (bleu) et actuelles (rouge) du grizzli dans l'ouest américains. En bas, l'effet de couche Blur est utilisé pour indiquer le flou / l'incertitude sur les limites.

Bloom

Cet effet produit des zones lumineuses autour des entités de la couche. Vous pouvez ajouter ainsi une lueur à vos couches pour des cartographies d'incendies, d'éruptions volcaniques, de points d'éclairages ou pour mettre en évidence des entités sur lesquelles vous souhaitez attirer l'attention (comme dans cet exemple mis à jour qui montre les empreintes de bâtiments de New York par année de construction). Vous pouvez combiner plusieurs effets sur une même couche et utiliser des effets similaires ou différents sur plusieurs couches d'une même carte. Dans la carte ci-dessous, les emplacements de feu actifs ont un effet de floraison tandis que la couche de fumée a plusieurs effets, y compris le flou pour une limite floue.

 
Drop-shadow

Cet effet est utile lorsque vous souhaitez que certaines entités se démarquent du reste des entités de la couche ou de la carte. Par exemple, vous pouvez appliquer cet effet à vos étiquettes (couche de référence) pour les rendre lisibles.

Les captures d'écran suivantes montrent la même carte, avec et sans effets. En bas, l'ombre portée est appliquée aux entités qui croisent les limites des arrondissements de Londres, tandis que les effets de flou et de luminosité (réduite) sont utilisés pour désaccentuer les entités ne répondent pas à ces critères. La carte (inspirée de  ce tweet ) montre l'indice global de privation multiple en 2019 subie par les personnes vivant dans la région du Grand Londres.

  
Étant donné que certains effets tels que l'ombre portée et le flou sont sensibles à l'échelle, Esri a également amélioré la partie "Effets" de l'API pour rendre les effets dépendants de l'échelle.

Vous pourrez en savoir plus en explorant les exemples de code qui tirent parti de ces effets qui peuvent vraiment transformer votre carte et l'expérience globale de votre application. Vous pouvez également creuser un peu plus en lisant la documentation sur chacun des effets.
 
 
Widget de profil d'élévation (version beta)

Depuis cette version 4.18 de l'API, vous pouvez créer des profils d'élévation à l'aide du nouveau widget ElevationProfile. Disponible à la fois sur les objets MapView et SceneView, le widget permet à l'utilisateur de dessiner ou de sélectionner de manière interactive des lignes existantes sur votre carte (ou scène) pour comparer la surface du terrain mais aussi des objets 3D présents (dans une scène) tels que des bâtiments. Le graphique est calculé en utilisant l'élévation du sol et fournit des statistiques supplémentaires le long de la ligne. L'utilisateur peut personnaliser le widget en basculant ses éléments visibles et en ajustant les étiquettes et les couleurs de ligne.



Mise à jour des couches 3D

Plus tôt cette année, Esri avait introduit des capacité de mise à jour sur les couches d'entités 3D. Cet effort se poursuit dans cette version en ajoutant la prise en charge de nouveaux types de couches et des aides interactives.

Vous pouvez désormais mettre à jour les attributs des couches de scène d'objets 3D à l'aide du widget Editor existants ou en appelant par code la fonction applyEdits(). Les modifications sont appliquées à la couche d'entités associée, mais prises en compte et rendues par l'API jusqu'à ce que le cache I3S soit mis à jour. Cette approche est cohérente avec la manière dont d'autres produits tels qu'ArcGIS Pro traitent les modifications des couches de scènes.


Lors de la modification interactive de géométries (lignes et polygones), la nouvelle fonction d'auto-accrochage aidera vos utilisateurs à dessiner des géométries précises avec des contraintes géométriques telles que des lignes parallèles et des angles droits lors de la modification de couches d'entités dans des scènes 3D. Vous activerez l'auto-accrochage via la nouvelle propriété SketchViewModel.snappingOptions et activez-la lors d'une opération de dessin.

Il s'agit de la première étape vers l'activation de complet l'accrochage aux entités dans les workflows de mise à jour 2D et 3D. Cette prise en charge sera étendue progressivement au cours des versions ultérieures.



Navigation contextuelle

Les zooms, les déplacements et les rotations  interactifs dans la partie souterraine des scènes ou dans les parties très haute (avec une grande inclinaison) se sont considérablement améliorés. Un nouvel algorithme de navigation contextuelle prend désormais en compte les objets visibles pour mieux prédire la zone d'intérêt. Vous remarquerez donc une expérience de navigation plus stable, en particulier lorsque vous vous déplacez autour et vers des objets souterrains.


La navigation contextuelle ne nécessite plus de cliquer exactement sur les entités pour déplacer la caméra.


Transparence indépendante de l'ordre des entités

Jusqu'à maintenant l'approche pour l'affichage de la transparence garantissait que la surface la plus transparente à l'avant et toutes les entités opaques derrière étaient toujours rendues. En fonction de la position de la caméra, d'autres éléments transparents à l'arrière étaient visibles de manière sélective, ce qui les faisait scintiller lors de la navigation.

Une nouvelle approche de la transparence dite "indépendante de l'ordre" (OIT) garantit que tous les objets transparents sont rendus indépendamment de la caméra. Ceci est utile lors de la visualisation d'une grande quantité de symboles couvrant d'autres entités transparentes. Les scènes avec des WebStyles 3D semi-transparents ou une symbologie d'icônes transparentes (comme le style Firefly par exemple) bénéficient également de cette transparence améliorée.



Prise en charge de Mars et de la Lune

On peut clairement dire que l'API couvre de nouveaux espaces dans cette dernière version ! En effet, vous pourrez désormais utiliser l'objet SceneView pour exploiter les fonds d'imagerie et les couches d'élévation de la Lune et de Mars, mais également vos couches contenant des informations cartographiées sur ces deux corps célestes. L'atmosphère et les dimensions physiques utilisées dans les outils interactifs tels que les mesures sont automatiquement ajustées lors du chargement d'une couche avec un système de coordonnées extraterrestre pris en charge.

 
 
Construire des symboles vectoriels

Vous pouvez symboliser vos éléments graphiques et vos couches d'entités à l'aide de symboles CIM (en savoir plus sur la spécification Cartographic Information Model). Les symboles CIM sont des symboles vectoriels multicouches qui s'affichent de manière impeccables à n'importe quelle échelle. Ces symboles sont puissants car vous pouvez concevoir votre propre symbole CIM personnalisé à l'aide d'une ou plusieurs couches de symboles. De plus, vous pouvez mettre à jour individuellement des couches de symboles de manière dynamique en fonction de la logique de l'application et des attributs de vos données. 


Pour faciliter le processus de création de ces symboles personnalisés, nous avons introduit un générateur de symboles CIM. Cette application fournit un environnement dans lequel vous pouvez concevoir des symboles CIM avec une interface utilisateur simple, copier le JSON du symbole et l'utiliser dans une application web créée avec l'API JavaScript ArcGIS. Vous en apprendrez davantage sur cet outil dans le récent article du blog ArcGIS: CIM Symbol Builder .


Widget de dessin

Le widget Sketch a reçu beaucoup d'attention de la part des développeurs pour cette version ! En effet, en plus de quelques améliorations de performances et de qualité visuelle, Esri a ajouté deux nouveaux outils de sélection: la sélection par rectangle et la sélection par lasso. L'utilisateur final peut utiliser ces outils pour sélectionner un ou plusieurs éléments graphiques à la fois pour les faire pivoter, les mettre à l'échelle, les déplacer ou les supprimer. Dans une prochaine version, l'API permettra la même fonctionnalité dans le widget Editor.



Fin de la prise en charge des navigateur IE11 et Edge Legacy

La prise en charge d'Internet Explorer 11 et Edge Legacy pour une utilisation avec l'API JavaScript ArcGIS est devenue obsolète à partir de la version 4.16. La version 4.17 était la dernière version prenant en charge ces navigateurs. Cela signifie que les applications créées avec 4.18 (et suivantes) ne fonctionneront pas dans IE11 / Edge Legacy. Consultez la page Configuration système mise à jour et la page Pourquoi Esri met-elle fin au support d'Internet Explorer 11?  du blog ArcGIS pour en savoir plus.


Et plus encore à découvrir…


Il existe de nombreuses autres évolutions dans cette version 4.18, telles que la possibilité d'utiliser des mises en page personnalisées pour l'impression, des améliorations sur les objets ImageryLayer telles que l'identification, ou encore la prise en charge de websockets personnalisés pour les couches de flux dans les scènes 3D. Assurez-vous de consulter les notes de version et de tester les nouveaux exemples de code pour avoir une vision complète  de cette nouvelle version !

Partager cet article:

Rejoindre la discussion

    Les commentaires à propos de cet article: