librairie JavaScript open-source qui permet d’afficher des globes 3D et des cartes 2D/3D dans un navigateur.

🌍 Qu’est-ce que CesiumJS ?

  • C’est une librairie JavaScript open-source qui permet d’afficher des globes 3D et des cartes 2D/3D dans un navigateur.
  • Elle est utilisée par la NASA, la DARPA, et beaucoup d’acteurs en géospatial.
  • Contrairement à Google Earth Web, elle permet d’importer et d’afficher tes propres objets 3D.

🔑 Points forts par rapport à Google Earth

  1. Import de modèles 3D
    • Formats supportés : glTF / glb (le standard 3D moderne), 3D Tiles (optimisé pour gros datasets), KML, GeoJSON.
    • Tu peux placer ton modèle exactement où tu veux, avec orientation, altitude, etc.
  2. Intégration facile dans une WebApp
    • C’est une librairie JavaScript → tu peux intégrer directement dans un site React, Vue, Angular, etc.
    • Tu gardes la main sur l’interactivité (contrôles, clics sur bâtiments, overlays, etc.).
  3. Pas de limitation Google
    • Google Earth Web ne permet pas d’ajouter des 3D custom.
    • Avec CesiumJS, tout est libre, tu affiches tes données comme tu veux.
  4. Écosystème puissant
    • Cesium ion (hébergé par Cesium) : pour convertir et streamer de gros modèles.
    • Plugins pour Unreal Engine et Unity → intégration temps réel, VR/AR.

🚀 Exemple simple avec un modèle glTF

Voici un snippet (JavaScript) qui charge un bâtiment 3D sur une carte CesiumJS :

import { Viewer, Cartesian3, Transforms } from "cesium";

const viewer = new Viewer("cesiumContainer", {
  terrain: Cesium.createWorldTerrain()
});

// Charger un modèle glTF
const entity = viewer.entities.add({
  name: "Mon bâtiment",
  position: Cartesian3.fromDegrees(47.5, -18.9, 0), // Longitude, Latitude, Altitude
  model: {
    uri: "./batiment.glb",
    scale: 1.0
  }
});

viewer.trackedEntity = entity;

👉 Résultat : ton bâtiment 3D (au format .glb) est placé à la coordonnée choisie sur le globe.

🔗 Tutos YouTube CesiumJS