Géolocalisation et cartes en JavaScript (Node.js) : bibliothèques et exemples

Formateur Python en ligne pour débutants

Apprenez Python facilement sans surcharge théorique. Résolvez des tâches pratiques avec vérification automatique et écrivez du code directement dans le navigateur.

Start Course

Géolocalisation et cartes en JavaScript (Node.js)

Le travail avec les données géographiques et l'affichage de cartes est l'une des tâches clés des applications web modernes. Dans l'écosystème Node.js, il existe de nombreuses bibliothèques permettant de traiter les coordonnées, de construire des itinéraires, d'effectuer du géocodage inversé et de rendre des cartes interactives. Dans cet article, nous examinerons les principaux outils et fournirons des exemples pratiques de code pour la partie serveur (Node.js).



1. Bibliothèques principales pour travailler avec les données géographiques



1.1. Leaflet (côté client) et node-leaflet

Leaflet est la bibliothèque JavaScript la plus populaire pour les cartes interactives. Elle fonctionne côté navigateur, mais pour Node.js, il existe le paquet leaflet (via npm install leaflet), qui permet de rendre des cartes sur le serveur à l'aide de leaflet-headless ou d'utiliser des données au format GeoJSON.

Exemple de génération d'une carte sous forme d'image sur le serveur (avec leaflet-static) :

const L = require('leaflet');const { createCanvas } = require('canvas');

const map = L.map(createCanvas(800, 600), { center: [55.751244, 37.618423], // Moscou zoom: 10});

L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© Contributeurs OpenStreetMap'}).addTo(map);

// Export en PNG (simplifié)const buffer = map.getCanvas().toBuffer();require('fs').writeFileSync('map.png', buffer);


1.2. OpenStreetMap (OSM) et Overpass API

OpenStreetMap fournit des tuiles gratuites et une API pour rechercher des objets. Dans Node.js, pour travailler avec OSM, on utilise souvent le paquet osmosis ou des requêtes HTTP directes vers https://nominatim.openstreetmap.org.

Exemple de géocodage inversé (obtention d'une adresse à partir de coordonnées) :

const fetch = require('node-fetch');

async function reverseGeocode(lat, lon) { const url = `https://nominatim.openstreetmap.org/reverse?format=json&lat=${lat}&lon=${lon}`; const response = await fetch(url, { headers: { 'User-Agent': 'PythonLibExample/1.0' } }); const data = await response.json(); return data.display_name;}

reverseGeocode(55.751244, 37.618423).then(addr => console.log(addr));// Résultat : "Moscou, Russie, Place Rouge"


1.3. Turf.js — analyse géospatiale

Turf.js est une bibliothèque puissante pour effectuer des opérations géométriques : tampon, union de polygones, calcul de distances, de surfaces, etc. Elle fonctionne à la fois dans le navigateur et dans Node.js.

Exemple de calcul de distance entre deux points (en kilomètres) :

const turf = require('@turf/turf');

const point1 = turf.point([37.618423, 55.751244]); // [lon, lat]const point2 = turf.point([30.315868, 59.939095]); // Saint-Pétersbourg

const distance = turf.distance(point1, point2, { units: 'kilometers' });console.log(`Distance : ${distance.toFixed(2)} km`); // ≈ 634,5 km


1.4. GeoJSON et shapefile

GeoJSON est un format de stockage de structures géographiques (points, lignes, polygones). Dans Node.js, pour travailler avec, le JSON.parse intégré suffit, et pour lire les fichiers shape, on utilise le paquet shapefile.

const shapefile = require('shapefile');

shapefile.open('path/to/file.shp') .then(source => source.read() .then(function log(result) { if (result.done) return; console.log(result.value); // GeoJSON Feature return source.read().then(log); })) .catch(error => console.error(error));


2. Outils avancés



2.1. Mapbox GL JS (Node.js)

Mapbox fournit une plateforme commerciale avec des cartes très détaillées. Pour le rendu côté serveur, utilisez @mapbox/mapbox-gl-native. Une clé API est requise.



2.2. Nominatim (géocodage)

Recommendations