IGO2 : 1er

atelier technique

de

développement

17 mai 2017

2

CITYN

Plan

●Qu’est-ce qu’IGO2 et pourquoi ?

●Décision de l’automne 2016 lors de l’atelier dev

●Projet de sécurité civile hiver 2017

●Nouveaux services et API

●Architecture, technologies et logiciels

●Angular, Angular-CLI et Angular Material

●Librairie versus Application

●Requis pour l’installation et développement

●Liens utiles

●Questions et commentaires

●Exercices de codage pour développeurs

3

Pourquoi IGO2 et besoins ?

●IGO1 : ne supporte pas le mobile et tablette : difficulté d’interaction

●IGO1 : technologies datant de 2010 (G.O.LOC, OpenLayers 2 et GeoExt 1.0)

●IGO1 : erreurs limitant le développement et devant être corrigées (langue, lourdeur

avec PHalcon, licence multiple $$ : ExtJS, procédure d’installation complexe: WAMP)

●IGO1 : sous-utilisé au MSP à cause de la complexité de certains outils et d’accéder

facilement à une information dans des contextes précis.

●Nouveaux besoins : simplification de l’interface, adapté au mobile, 3D, meilleure

efficacité avec vecteurs, nouvelles sources de données : CARTO, MapBox, Vector

Tile. etc.

●Aucune solution aussi intégrée sur le marché et pouvant répondre aux besoins

rapidement d’IGO1 et les nouveaux.

4

Retour sur l’atelier dev -

automne 2016

●Atelier IGO2 en novembre 2016 (tous les MO présents) :

Décision : Migrer vers la nouvelle version d’OpenLayers 3 (maintenant 4)

Décision : Tirer profit de l’expertise acquise au MSP avec Angular2 (4)

Décision : internationalisation du code

Laisser tomber des logiciels comme PHalcon et ExtJS

Faciliter la documentation (Readthedocs)

Simplifier l’installation

Meilleure procédure de test et d’assurance qualité

Décision : reprendre les éléments à succès d’IGO1 dans IGO2

Décision : créer IGO2 à partir du besoin minimal de la sécurité civile (2017).

5

Projet IGO2 en sécurité civile (avril 2017)

●Projet sur les années fiscales 2016/2017 - 2017/2018

●Un des livrables est donc un navigateur carto autant mobile et poste de travail

●Simplifier la recherche d’information et d’opérations

●Livraison 1 : Mai 2017 (https://overv.io/infra-geo-ouverte/igo2/)

Librairie fournissant ces fonctionnalités :

■ Afficher des couches WMS et à la volée (recherche par nom)

■ Obtenir de l’information (getInfo)

■ Se localiser sur le territoire (adresse, lieu) ou position

■ Sauvegarder un contexte de carte et le partager au besoin

■ Analyse temporelle WMS-Time

■ Impression PDF

■ Intégrer la carte dans une autre application (CMS, Débit niveau)

Assembler ces fonctionnalités dans un navigateur léger et moderne (visuel,

outil)

6

Scénarios de maquette

Prémices des scénarios

Minimiser les outils présents sur la carte

Minimiser l’utilisation de l'arborescence de couches

Maximiser les outils de recherche et service/API de données

(couches, localisation, API, JSON)

Maximiser l’utilisation de contexte de cartes

Reprendre le meilleur de Google Maps, navigateur du fédéral avec

ArcGIS et GeoAdmin des Suisses.

7

Services API

1.API / Service de recherche de couches : ElasticSearch à partir du

WMS GetCapabilities et contenu dans un catalogue (ex. CKAN)a.Éventuellement, la recherche sera lié à l’API de contexte et aura une façade de

sécurité

b.Peut être centralisé et hébergé au MSP (au besoin)

c.Peut s’installer localement (NodeJS et ElasticSearch)

2.API / Service de gestion de contexte (NodeJS, doc : Swagger) : ajout,

modification, consultation, liste de couches d’un contexte, type de

couches, outils et type d’outilsa.Peut être centralisé et hébergé au MSP (au besoin)

b.Peut s’installer localement (Sequelize : SQLite ou PG ou à venir : Oracle) :

https://github.com/infra-geo-ouverte/igo2-api

c.Pas nécessaire si vous voulez utiliser les contextes fichiers JSON

3.Ces deux services API pourront s’intégrer dans d’autres applications

qu’IGO2.

8

Suivi des travaux

Installation possible par l'entremise de conteneur Docker (multi-OS :

Linux, Windows, Mac) : https://infra-geo-ouverte.github.io/igo2/#docker

Sources compilées disponibles pour installation rapide :

https://github.com/infra-geo-ouverte/igo2/releases

Outil de test intégré avec Travis-CI : https://travis-ci.org/infra-geo-

ouverte/igo2

Service de documentation supportés par Readthedocs en format

RestructuredText (.rst) : http://igo2.readthedocs.io/fr/latest/

9

Architecture, technologies

et logiciels (cas du MSP)

10

Angular, Angular-CLI et

Angular Material

Angular

Framework de développement créé par Google

Utilisation de TypeScript (développé par Microsoft) qui se compile en

JavaScript

Angular-CLI

Intégration d’outils de tests, de compilation et de développement

Angular Material

Librairie de composantes de base robustes

Basé sur la spec “Material Design” https://material.io/guidelines/

11

Architecture d'un module

Angular

Module A

Component 1

Component 2

12

Schéma d’IgoFeatureModule

13

Librairie versus Application

Segmentation en deux dépôts en cours de route : Librairie (lib) et

Application (assemblage)

Pourquoi ?

Permettre une configuration plus personnalisée par les

organisations

Permettre d’intégrer certaines composantes et outils à leur guise

Permettre le développement de la librairie indépendamment de

l’assemblage

Permettre à plus de contributeurs externes de contribuer

Permettre l’utilisation de la librairie dans un autre projet qu’IGO2

14

Requis pour l’installation et

développement

● Développement (local)

NodeJS

NPM

Git

Optionnel: Augury dans Chrome

IGO2 (Librairie ou Application)

● Production

Comme en mode développement avec possibilité de faire son

propre build;

Ou utiliser les sources compilées disponibles https://github.com/infra-

geo-ouverte/igo2/releases

15

Liens utiles

●Librairie IGO2

○https://github.com/infra-geo-ouverte/igo2-lib

●Application IGO2

○https://github.com/infra-geo-ouverte/igo2

●Liste igo-dev@

○Utiliser la liste igo-dev@ en spécifiant la version IGO2

●Tutoriel Angular

○https://angular.io/docs/ts/latest/tutorial/

●Guide de développement Rangle

○https://angular-2-training-book.rangle.io/

●Formation Académie Angular

○http://www.academieangular.ca/ (venu à Qc en avril 2017)

○http://www.technologia.com/fr/technologies-de-linformation/developpement-

web/concepts-de-base-et-avances-web/angular-2/

16

À venir (mai 2017)

1.Livraison 1 d’un navigateur IGO2 de base pour la production : juin 2017

1.Suite des développements (à discuter):

a.Amélioration des fonctions existantes (ex.: analyse temporelle) et correction de

bugs potentiels

b.Amélioration de la documentation

c.Meilleur support de IGO2 en mode “embedded”

d.Analyse spatiale simple

e.Édition simple en ligne

f.Itinéraire (OSRM)

g.Sécurité+proxy, amélioré le service de contexte, 3D (Cesium), ajout de SHP-KML

(ogrweb), application hybride (cordova)

h.Autres ateliers techniques avec IGO2 ?

17

Commentaires/questions ?

18

Exercices pour développeurs

1.Valider l’installation

1.Import d’un module

1.Ajout d’une table de résultats

1.Questions