Development
Web Development
Leaflet
Cartographie sur le Web
4.5 (8 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
32 students enrolled

Cartographie sur le Web

Leaflet, JavaScript, Open Street Map et Open Data
4.5 (8 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
32 students enrolled
Created by Richard Carlier
Last updated 1/2020
French
Preview this course
Cartographie sur le Web
Price: $34.99
Buy now
30-Day Money-Back Guarantee
This course includes
  • 8 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Intégrer des cartes dans un site Web, créées en Javascript avec Leaflet
  • Ajouter sur la carte des marqueurs, des images, des légendes, des dessins, des interactions...
  • Obtenir des données sur les cartes (coordonnées de points, géocodage (adresse postale), géodécodage, géolocalisation...
  • Afficher des informations sur la carte (zones colorées selon les valeurs contenues dans un fichier GeoJSON)
Course content
Expand all 43 lectures 07:57:33
+ – Préambule technique (MAPGEO-01)
6 lectures 01:25:03
Logiciels
Preview 11:43
HTML : rappels minimalistes [mapgeo-01-02.html]
14:47
CSS : rappels minimalistes [mapgeo-01-03.html]
12:03
Javascript : rappels de base [mapgeo-01-04.html]
22:18
Open Data - récupérer des données
07:00
Javascript : charger des données [mapgeo-01-06.html]
17:12
+ – Carte de base (MAPGEO-02)
7 lectures 45:04
Introduction
Preview 01:19
Notre première carte [mapgeo-02-02.html]
12:54
Changer le fond de carte [mapgeo-02-03.html]
07:23
Ajouter un marqueur [mapgeo-02-04.html]
05:15
Obtenir la latitude / longitude [mapgeo-02-05.html]
06:52
Nécessaire organisation... [mapgeo-02-06.html]
09:22
En résumé
01:59
+ – Les marqueurs (MAPGEO-03)
6 lectures 01:12:00
Introduction
Preview 00:38
Personnaliser les marqueurs [mapgeo-03-02.html]
32:24
Multiplier les marqueurs [mapgeo-03-03.html]
10:22
Différencier les marqueurs [mapgeo-03-04.html]
05:08
Controler, filtrer les marqueurs [mapgeo-03-05.html]
21:00
En résumé
02:28
+ – Dessiner sur la carte (MAPGEO-04)
6 lectures 01:06:15
Introduction
Preview 01:04
Ajouter des formes (lignes, cercles...) [mapgeo-04-02.html]
27:16
Ajouter des images [mapgeo-04-03.html]
20:04
Zoomer sur une image [mapgeo-04-04.html]
07:53
Ajouter une légende, une échelle [mapgeo-04-05.html]
08:42
En résumé
01:16
+ – Utilitaires (MAPGEO-05)
8 lectures 01:30:56
Introduction
Preview 00:49
Obtenir la lat/lng (version améliorée) [mapgeo-05-02.html]
09:10
Géolocaliser sa position [mapgeo-05-03.html]
09:38
Géocodage (adresse -> lat/lng) [mapgeo-05-04.html]
14:25
Géodécodage (lat/lng -> adresse) [mapgeo-05-05.html]
22:41
Evènements et méthodes [mapgeo-05-06.html]
18:13
Compléments sur la carte [mapgeo-05-07.html]
13:33
En résumé
02:27
+ – GeoJSON (MAPGEO-06)
6 lectures 01:00:41
Introduction
Preview 00:43
Le format GeoJSON
13:21
Tracer des contours [mapgeo-06-02.html]
11:49
Interactions [mapgeo-06-03.html]
17:12
Visualiser des informations [mapgeo-06-04.html]
15:55
En résumé
01:41
+ – Section Bonus
1 lecture 37:01
Bonus : utiliser PHP pour générer du JSON - et l'afficher sur nos cartes via JS
37:01
Requirements
  • Bases de Html / Css / Javascript
Description

Dans ce cours, vous apprendrez à créer des cartes en JavaScript en utilisant la bibliothèque gratuite Leaflet, référence mondiale, pour les intégrer dans vos pages Web.

La section 1 sera consacrée à quelques révisions html/css/JavaScript, ainsi que la démarche à suivre pour récupérer des données de l'Open Data, et les traiter en JavaScript

Dans la section 2, la première carte construite sera simple, avec un fond de carte et un point central repéré par un marqueur.

Dès la section 3, nous ajouterons d'autres marqueurs, en choisissant la couleur, et intégrant des popups d'information. L'ajout d'une fenêtre de contrôle permettra de choisir quels points seront visibles (et quel fond de carte).

Dans la section 4, nous dessinerons des formes simples (lignes, cercles, rectangles) ou plus complexes (polylines, polygones). Nous ajouterons également des éléments importants de la cartographie: échelle, légende, images... Nous utiliserons même une image de 1900 en fond de carte!

Mais nos cartes peuvent également nous servir à obtenir des informations, ce qui sera l'objet de la section 5. Sans surprise, des coordonnées géographiques (latitudes, longitudes), mais nous pratiquerons le géocodage et le géodécodage (convertir une adresse postale en coordonnées, ou l'inverse), et finirons par de la géolocalisation (où suis-je ?).

La section 6 sera consacrée au format GeoJSON, et nous y verrons comment récupérer sur l'Open Data des fichiers de contours géographiques (pays, régions, départements...) et comment les tracer sur la carte. Nous finirons par une carte choroplèthe (où les régions sont colorées en fonction d'une mesure statistique).


Embarquons ensemble à travers le monde... des cartes Web !


NB: la référence entre crochets correspond au nom des fichiers html créés lors de la session)

Who this course is for:
  • Créateurs de sites web voulant intégrer des cartes plus ou moins élaborées et interactives