Formation : cartographie web avec l’API JavaScript Leaflet
Qgis
Ce cours se veut avant tout une formation pratique. Il s’orientera autour d’un projet de création d’une interface cartographique permettant de visualiser différentes couches de données et différentes couches de base (« basemap »). Le cours prendra la forme de démonstrations de développement de fonctionnalité, entrecoupé de capsule magistrale. La première section du cours s’attardera à donner des bases de programmation web, aux participants du cours, puis nous rentrerons dans le vif du sujet en créant notre première carte web et différentes fonctionnalités géospatiales.
Mis à jour le
La formation cartographie web avec l’API JavaScript Leaflet en bref
- Durée
- 3 jours
- Horaire
- 9 h à 16 h 30
- Format
- Classe virtuelle en direct ou présentiel à Montréal et à Québec
- Prix
- 1 052 $ par participant, ou 894 $ pour organismes publics et OBNL (taxes en sus)
- Langue
- Français
Doussou Formation et cartographie web avec l’API JavaScript Leaflet en quelques faits
- Depuis 2016Doussou Formation donne des formations professionnelles au Québec
- 300+formations spécialisées au catalogue
- 97 %de satisfaction selon les évaluations clients
- RAP · CPMTFournisseur accrédité et organisme formateur reconnu
Prochaines sessions de la formation cartographie web avec l’API JavaScript Leaflet
Programme de la formation cartographie web avec l’API JavaScript Leaflet
Introduction à la formation cartographie web avec l’API JavaScript Leaflet
Installation des outils de développement
- Installation de Visual Studio Code;
- Installation de QGIS;
- Installation de XAMP;
Introduction à la programmation web
- Comment fonctionne Internet;
- Comment fonctionne un site web;
- Front-End VS Back-End;
L'essentiel du HTML5 pour appréhender Leaflet
- Créer un document HTML;
- Head et Body;
- Les titres;
- Les paragraphes et les listes;
- Les images;
- Les liens;
- Les formats;
- Les tables;
- Les bloques;
- Les « Layouts »;
- Les formulaires, les boutons, et les « inputs »;
- Les commentaires;
- Les ID et les classes;
- Création de l’interface HTML;
L'essentiel du CSS3 pour appréhender Leaflet
- Inclure un fichier CSS dans son document html;
- Les sélecteurs;
- Modifier le rendu du texte;
- Modifier l’arrière-plan d’un élément;
- Les largeurs et les hauteurs;
- Le positionnement;
- Les types d’affichages (display);
- Les marges externes et internes;
- Les bordures;
- Les media query
L'essentiel de JavaScript pour appréhender Leaflet
- Déclarer une variable et les types de données;
- Les opérateurs;
- Les opérateurs conditionnels;
- Les boucles;
- Les fonctions;
- JavaScript et le DOM;
- Le scope;
- Le hoisting;
L'essentiel de JQuery pour appréhender Leaflet
- Sélectionner des éléments avec JQuery;
- Les évènements avec JQuery;
- Les effets avec JQuery;
- Modifier le DOM avec JQuery;
- Sélectionner les parents et les enfants d’un élément;
- AJAX
Les bases de Leaflet
- Créer sa première carte avec Leaflet;
- Changer les fonds de carte avec Leaflet;
- Ajouter un marqueur à sa carte;
- Ajouter un pop-up;
Le GeoJSON
- Transformer une Shapefile en GeoJSON avec QGIS
- La structure du GeoJSON;
- Ajouter un GeoJSON a une carte Leaflet;
- Styler les GeoJSON dans Leaflet;
- Créer un pop-up avec les attributs du GeoJSON;
- Interagir avec le tableau de bord en fonction d’évènement sur la carte
Centrer la carte sur la position de l’utilisateur
- Utiliser l’API HTML de géolocalisation pour récupérer la position de l’usager;
- Centrer la carte sur la position de l’utilisateur;
- Créer un marqueur pour la position de l’utilisateur
Créer un géocodeur avec l’API Nominatim - Open Street Map
- Créer le formulaire;
- Récupérer la valeur du formulaire;
- Passer la valeur à l’API Nominatim
- Récupérer la position et centrer la carte sur celle-ci
- Créer un marqueur pour la position de l’utilisateur
Pour aller plus loin
- Les bases de données à référence spatiales
- Les serveurs cartographiques
- Générer des GeoJSON dynamiques côté serveur
- Créer des applications transactionnelles
Votre formateur cartographie web avec l’API JavaScript Leaflet
Tarifs et informations pratiques
Tarif préférentiel
894 $ / participant
Organismes publics et OBNL · taxes en sus
Prix public
1 052 $ / participant
Entreprises et particuliers · taxes en sus
Informations pratiques
- Durée : 3 jours
- Horaire : 9 h à 16 h 30
- Format : Classe virtuelle en direct ou présentiel à Montréal et à Québec
- Paiement : en ligne (PayPal ou carte) à l’inscription, ou sur facture pour les organisations
Formation cartographie web avec l’API JavaScript Leaflet en entreprise
Formez toute votre équipe en groupe privé, sur vos propres documents, dans vos locaux ou en classe virtuelle, aux dates qui vous conviennent.
Avis des participants
97 % de satisfaction (évaluations de fin de formation, 120 évaluations) · Lire tous les témoignages
Pourquoi suivre cette formation cartographie web avec l’API JavaScript Leaflet
Objectifs : ce que vous saurez faire
L’objectif de ce cours est de donner une compréhension sommaire des technologies web nécessaire à la réalisation d’un interface cartographique web. À la fin de ce cours, l’étudiant aura en main une interface cartographique web réalisée à l’aide de l’API Leaflet qu’il sera en mesure de modifier afin de personnaliser le style, d’afficher différentes couches d’information, d’afficher différentes couches de base, etc. L’étudiant aura appris à récupérer la position de l’utilisateur final de la plateforme à l’aide de l’API HTML de géolocalisation. Il aura également appris à créer un géocodeur (transforme une adresse en coordonnées géographiques) à l’aide de l’API Nominatim d’Open Street Map.
Prérequis
- Connaître l’outil informatique
Ce qui est inclus
- Support de cours et fichiers d’exercices pour chaque participant
- Attestation de participation
- Possibilité de coaching personnalisé après la formation
- En session publique en présentiel :
- Thé et café
- Dîner dans un restaurant à proximité
- Stationnement (dans certaines villes)
- Connexion Internet sans fil