Le nouveau mode Globe de Giro3D

Dans cet article, nous approfondissons la nouveauté majeure de Giro3D : le mode globe.

Note: Cet article concerne une fonctionnalité à venir, et certains détails peuvent être amenés à changer d’ici la version finale.

Les systèmes de coordonnées projetés

Jusqu’ici, il n’était possible d’afficher dans Giro3D que des cartes (Map) basées sur des systèmes de coordonnées projetés, tels que Web Mercator, utilisé sur la majorité des services de webmapping tel que Google Maps ou Lambert 93 bien connu des géomaticiens français.

Dans une scène 3D

Dans une scène Giro3D, tout est 3D. Cela signifie qu’un repère projeté à 2 axes sera tout de même représenté dans un espace à 3 dimensions (le troisième axe restant « virtuel »).

Une carte OpenStreetMap affichée dans Giro3D via l’entité Map. Même si la carte elle-même est en 2D, elle peut être affichée sous différents angles par la scène 3D.

Les systèmes de coordonnées non-projetés

Le mode Globe de Giro3D se base sur un système de coordonnée géocentrique, dans lequel le repère a pour origine le « centre » de la Terre (ou de tout autre objet sphérique). Cet objet sphérique est modélisé par un ellipsoïde.

By Chuckage – Own work, CC BY-SA 4.0, https://commons.wikimedia.org/w/index.php?curid=109644198

Dans ce type de repère, les coordonnées géodésiques (exprimées en angles, comme la latitude et la longitude, et en mètres pour l’élévation) doivent être converties en coordonnées cartésiennes (exprimées en unités linéaires, comme les mètres), pour pouvoir être affichées dans le navigateur. Cette conversion géodésique / cartésien est effectuée par l’objet Ellipsoid, qui est à la base de la représentation des globes.

Le mode Globe

Giro3D permet d’afficher un globe d’après un ellipsoïde arbitraire ou (ou bien d’utiliser l’ellipsoïde par défaut WGS84). Pour ce faire, il faut instancier une entité de type Globe plutôt que Map:

const defaultGlobe = new Globe();

const moon = new Globe({
  ellipsoid: new Ellipsoid({
    semiMajorAxis: 1_738_100,
    semiMinorAxis: 1_736_000,
  }),
});

Les fonctionnalités du Globe sont quasiment identiques à celles d’une Map. On peut y afficher une couche d’élévation (ElevationLayer), un nombre illimité de couches de couleur (ColorLayer), et bénéficier de toutes les autres fonctionnalités comme les graticules, les courbes de niveau, l’éclairage dynamique…

La principale différence se situe sur le fait que le Globe utilise simultanément deux systèmes de coordonnées: géodésique et cartésien, selon la fonctionnalité considérée.

Par exemple, le graticule utilisera le système géodésique pour exprimer le pas de la grille (en degrés). Les emprises des différentes couches seront également exprimées en coordonnées géodésiques (largeur et longueur en degrés).

Les repères relatifs

Nous avons dit que par défaut, le point d’origine de la scène 3D est le même que le point d’origine du repère géocentrique. Cependant, il est possible de déplacer le globe dans la scène, afin de représenter des systèmes orbitaux ou un système solaire complet:

moon.object3d.translateX(384_000_000);

Anatomie d’un globe

De façon très similaire à l’entité Map, l’entité Globe se découpe en plusieurs composants optionnels.

Le globe nu se compose d’une surface ellipsoïdale, et d’une couleur de fond.

Le globe seul, accompagné d’un graticule permettant de visualiser la courbure terrestre.

Nous pouvons y ajouter une couche d’élévation (ElevationLayer) colorisée par une rampe de couleurs (ColorMap):

Une couche d’élévation colorisée par une ColorMap.

Nous pouvons également y ajouter des couches de couleur (ColorLayer), en nombre illimité. Ajoutons la couche Mapbox satellite:

La couche Mapbox satellite

Ajoutons également une couche de nuages (issue de la NASA):

Une couche de nuages

Puis un éclairage dynamique, grâce à une lumière directionnelle three.js (DirectionalLight):

L’éclairage dynamique

Il est possible de modifier l’éclairage pour le faire correspondre à une date précise.

Enfin, ajoutons une atmosphère grâce à l’entité Atmosphere:

Le globe final

Conclusion

Le nouveau mode Globe permettra de créer des scènes gigantesques à l’échelle d’une planète, ou même d’un système solaire entier. Doté de la même API que l’entité Map, il est simple à utiliser.

Avantages de l’entité Globe

• Adapté aux très grandes scènes, voire à la planète entière
• Élimine les distorsions causées par les projections cartographiques
• Permet de visualiser les cycles jour/nuit à l’échelle de la planète
• Permet de visualiser des objets en orbite, comme la Lune ou des satellites artificiels
• Permet de visualiser l’horizon

Avantages de l’entité Map

• Adapté aux scènes locales (quelques kilomètres carrés), ou bien aux cartes 2D (OpenStreetMap, etc)
• Plus simple à manipuler pour les utilisateurs habitués aux outils cartographiques 2D
• Les axes de la scène sont identiques aux axes du système de coordonnées, ce qui simplifie les mesures
• Moins gourmand en ressources matérielles, car moins de transformations à effectuer
• Éclairage plus simple à réaliser

Galerie