Une librairie de développement cartographique en libre service Marc-Olivier Ethier et Clément Glogowski, Ville de Montréal

1. Libcarto
Une librairie de
développement cartographique
en libre service
Clément Glogowski et Marc-Olivier Ethier - Forum Géomatique 22 septembre 2023

2. Marc-Olivier
Ethier
Clément
Glogowski
Développeur/concepteur principal
TI - Géomatique
Analyste principal
TI - Géomatique

3. Division
Intelligence
d’Affaires et
Géomatique
Centre
d’expertise en
géomatique

4. Division
Intelligence
d’Affaires et
Géomatique
Centre
d’expertise en
géomatique
Centre
d’expertise en
intelligence
d’affaires

5. Division
Intelligence
d’Affaires et
Géomatique
Centre
d’expertise en
géomatique
Gouvernance
des données
Centre
d’expertise en
intelligence
d’affaires

6. Division
Intelligence
d’Affaires et
Géomatique
Centre
d’expertise en
géomatique
Gouvernance
des données
Centre
d’expertise en
intelligence
d’affaires
Valorisation
des données
corporatives

7. Mise en contexte
Collection de codes/scripts :
● Simplifie le développement
● Expose des fonctionnalités et
des outils prêts à l'emploi
Librairie
&
API ?

8. Mise en contexte
…fonctionnalités
préconstruites conçues pour
faciliter la création
d'applications et de
visualisations
cartographiques interactives.
Librairie
cartographique ?

9. Mise en contexte
… adresse réseau/web qui permet
d'accéder à des données
géospatiales facilitant ainsi leur
intégration dans des applications
SIG.
Service
cartographique ?

10. Mise en contexte
Service
cartographique ?

11. Mise en contexte
Source de données
Symbologie
● Géométrie
● Police
● Couleurs
● …
Filtres
…
Style
cartographique ?

12. Mise en contexte
● Mauvaise utilisation des données
corporatives
● Informatique grise / Cartographie grise
● Manque de ressources spécialisées
● Sécurité informatique
Enjeux municipaux ?

13. Objectif de la librairie
Comment résoudre
nos problèmes
organisationnels ?
● Faciliter
● Remplacer
● Uniformiser
● Inventorier
● Démocratiser

14. Comment résoudre
nos problèmes
organisationnels ?
● Faciliter l’ intégration
d’une carte dans les
applications
● Remplacer
● Uniformiser
● Inventorier
● Démocratiser
Objectif de la librairie

15. Comment résoudre
nos problèmes
organisationnels ?
● Faciliter
● Remplacer les multiples
technologies de
cartographie
● Uniformiser
● Inventorier
● Démocratiser
Objectif de la librairie

16. Comment résoudre
nos problèmes
organisationnels ?
● Faciliter
● Remplacer
● Uniformiser et
standardiser l’ accès aux
données corporatives
● Inventorier
● Démocratiser
Objectif de la librairie

17. Comment résoudre
nos problèmes
organisationnels ?
● Faciliter
● Remplacer
● Uniformiser
● Inventorier et cataloguer
les couches géospatiales
corporatives
● Démocratiser
Objectif de la librairie

18. Comment résoudre
nos problèmes
organisationnels ?
● Faciliter
● Remplacer
● Uniformiser
● Inventorier
● Démocratiser les
pratiques SIG aux TI
Objectif de la librairie

19. Autonomie / Libre-service
Un wrapper pour simplifier tout ca ?
La LibCarto pour les
gouverner tous ?
● Faciliter
● Remplacer
● Uniformiser
● Inventorier
● Démocratiser

20. Autonomie / Libre-service
Un wrapper pour simplifier tout ca ?
La LibCarto pour les
gouverner tous ?
● Faciliter
● Remplacer
● Uniformiser
● Inventorier
● Démocratiser

21. Lib
Carto
Applications
internes
Anatomie / Architecture
Catalogue de
Métadonnées
VTS
WFS
WMS
WMTS
Objets
Styles
Applications
internes
Portail Ville
Données
Ouvertes
Publication
Notification
Diffusion
/
sécurité
/
performance
Logiciels
Usagers
Usagers
Usagers
Usagers
Usagers
Usagers
BD
Réglementation

22. Applications
internes
Anatomie / Architecture
Catalogue de
Métadonnées
Objet
Applications
internes
Portail Ville
Données
Ouvertes
Publication
Notification
Logiciels
Usagers
Usagers
Usagers
Usagers
Usagers
Usagers
Réglementation
Usagers

23. Développement d’un
studio
cartographique en
libre service
Présentation du Studio

24. Administrer les styles
Présentation du Studio

25. Présentation du Studio
https://api.dev.interne.montreal.ca/api/it-platforms/geomatic/map-assets/v1/styles?code=
fond-de-carte,arrondissements-polygones,arrondissements-etiquettes
Jumeler les styles

26. Éditer / visualiser un style
Présentation du Studio

27. Présentation du Studio
Gérer les icônes

28. Présentation du Studio
Publier
● Fichier
● BD
● Services
Partager
● Privé
● Public
● Officiel
Documenter
● géocatalogueMTL

29. Concepts techniques
Config As Code ?
Développer une
application en
remplissant un fichier
de configuration.

30. Concepts techniques
{
containerId: "map",
environment: libCarto.Environment.DEV
};
Config as code ?

31. Concepts techniques
{
containerId: "map",
basemap: 'fdc-leger',
layers: [
'arrondissements-polygones',
'arrondissements-contours',
'arrondissements-etiquettes',
],
environment: libMap.Environment.DEV,
};
Config as code ?
● couches

32. Concepts techniques
{
containerId: "map",
basemap: 'fdc-leger',
layers: [
'arrondissements-polygones',
'arrondissements-contours',
'arrondissements-etiquettes',
],
position: {
type: "feature",
featureId: "'OCC-2106ZC11887865'",
idField: 'permitPermitId',
layerId: 'montreal:entraves-polygonales'
},
environment: libMap.Environment.DEV,
}
Config as code ?
● position

33. Concepts techniques
{
containerId: "map",
basemap: 'fdc-leger',
layers: [
'arrondissements-polygones',
'arrondissements-contours',
'arrondissements-etiquettes',
],
layersOptions: {
'arrondissements-polygones' : {
selectable: true,
selectionMethod: "click",
selectionColor: "rgba(248, 95, 8 ,0.7)",
}
},
environment: libMap.Environment.DEV,
}
Config as code ?
● sélection

34. Démocratisation
=
Documentation
Concepts techniques
● Documentation dynamique (TypeDoc)
● Déploiement en application web
● Déploiement en librairie

35. Documentation
automatisée
Concepts techniques
Documentation de la librairie

36. Concepts techniques
Exemples interactifs et documentés
Exemples
documentés et
interactifs en ligne

37. Concepts techniques
Exemples
documentés et
interactifs en ligne

38. Utilisation après
initialisation de la
configuration
Ex: sélection par attribut
● Appel WFS
● Supporte toutes les
couches et attributs
Concepts techniques

39. Ex: sélection par attribut
Concepts techniques
const mapOptions: IMapOptions = {
containerId: 'map',
basemap: 'fond-de-carte',
position: { type: PositionType.LATLON, point: [-73.7, 45.55] },
layers: ['arrondissements-contours', 'arrondissements-polygones',
'stations-lignes-de-metro-icones'],
layersOptions: {
'stations-de-metro': { visible: false },
'arrondissements-polygones': { selectable: true, selectionMethod:
SelectionMethod.CLICK },
},
environment: Environment.DEV
};
const myMap = createMap(mapOptions);
…
myMap.selectFeaturesByAttribute(
'arrondissements',
'nomArrond',
'Verdun'
);

40. Utilisation après
initialisation de la
configuration
Ex: Clusters
● Appel WFS (geojson)
● Simple d’utilisation
● Zoom automatisé
● Interaction possible
● Possibilité de filtrer
Concepts techniques

41. Concepts techniques
const mapOptions: IMapOptions = {
containerId: 'map',
basemap: 'fdc-leger',
layers: ['info-travaux-clusters'],
environment: Environment.DEV
};
const myMap = createMap(mapOptions);
…
const leaves = await myMap.getClusterLeaves(
'info-travaux-clusters',
clusterId
);
...
myMap.zoomToFeaturesExtent(leaves)
Ex: Clusters

42. Utilisation à
la Ville ?
Applications et projets
Services divers :
● GBeau
● Gogeo
● AGIR
● …
Lib Carto :
● Engagement Numérique pour
le portail citoyens

43. https://services.montreal.ca/cartes/entraves

44. https://services.montreal.ca/cartes/entraves

45. https://services.montreal.ca/cartes/pistes-cyclables

46. Gains et leçons apprises
Démocratisation
!!
Gains
Informations “vivantes”
Compatibilité accrue
Vélocité
Transparence

47. Gains et leçons apprises
Dépendance sur la Donnée
!?
Enjeux
Garder les choses simples
Pré-requis d’infrastructure

48. Perspectives d'avenir
?!
Avenir
Détection du changement !
Versionnement & Notification ?
Interopérabilité accrue ?
Ouverture du code ?

49. ??
Questions

50. Merci !