Présentation ApiViz et Solidata

Transcript

1. système Apiviz / Solidata Etalab talk 22/11/2019 Valoriser les données ouvertes avec les solutions open source Apiviz et Solidata Julien Paris jparis.py@gmail.com 06 83 65 84 91
2. Compréhension du besoin Moi, structure publique ou para-publique, je me suis donné du mal à produire des données (type tableurs ou datasets), et je suis incité par la loi à les publier en open data... Maintenant, comment valoriser mon travail, et donc mes données, au-delà de la simple publication du dataset ? J'aurais envie d'un site en ligne où l'on puisse explorer mes données, y faire des recherches, les voir sur une carte si besoin, exporter le dataset, exposer mes données à des services tiers, etc… et que ce soit joli, personnalisé, et réactif... … ah oui, derniers petits détails... … mais ce serait bien d'avoir mon site rapidement en ligne, genre dans 2 jours. … dans l'immédiat je n'ai pas les moyens suffisants pour prendre une équipe de développeurs, créer une plateforme, faire une start-up d'état dédiée, ou postuler à EIG… … je vous ai dit que le communiqué de presse était déjà parti ?
3. Compréhension du besoin
4. Introduction au système Apiviz / Solidata
5. Apiviz (frontend) vue carte vue tableur vue liste pages statiques Apiviz est un CMS (Content Management System) permettant de déployer un site internet complet de valorisation et de visualisation de vos données. Apiviz est un système libre et open source. Apiviz permet d'afficher autant des pages de contenus statiques que des pages de recherche dynamique des données à votre disposition.
6. Avantages du système Apiviz / Solidata • un site personnalisable (UI, contenus, données) en ligne • une gestion des données en ligne • exposer des données à d'autres services (API-fication de vos données) • protection des données et gestion des droits d'édition • un système modulaire (microservices indépendants) • codes open source (documentation ici) • une maintenance et R&D mutualisée (SAAS / PAAS) visualiser des données exposer des données
7. Schéma général du système Apiviz / Solidata 3/ ApiViz frontend (votre site) récupère les contenus statiques directement depuis Github ; 1/ ApiViz frontend (votre site) récupère sa configuration personnalisée via l'API d'Apiviz backend ; 2/ ApiViz frontend (votre site) requête les données à visualiser sur l'API de Solidata ;
8. Exemples en ligne de sites de valorisation de données
9. Sites exploitant le système de valorisation Apiviz / Solidata https://apiviz-demo-site.netlify.com Site de démo Apiviz
10. Sites exploitant le système de valorisation Apiviz / Solidata https://apiviz-preprod-sonum.netlify.com Données Mission Société Numérique https://carrefour-innovations-sociales.fr Données APCIS https://tiers-lieux-dataviz.netlify.com Données Mission Co-working
11. Sites exploitant le système de valorisation Apiviz / Solidata https://etalab-codes.netlify.com Données Codes Etalab https://ping-carto.netlify.com Données Ping carto https://conumm.netlify.com Données Conumm (PDL)
12. Options et intégration des visualisations à votre site
13. Apiviz et le "responsive" out of the box Apiviz est conçu de manière "responsive" afin de pouvoir s'adapter à différentes tailles d'écran et pouvoir être consulté sur des terminaux mobiles. Les menus de navigation et les filtres se "compactent" si la largeur de l'écran est réduite.
14. votre URL Intégration de vos visualisations dans un site existant votre site pré-existant vos contenus intégration d'une iframe En utilisant l'argument "?iframing=true" dans l'URL de votre site Apiviz vous pouvez l'inclure dans un autre site dans une iframe. vos contenus
15. Préparation de vos contenus et de vos visualisations
16. Intégration de votre charte graphique et de votre arborescence logo : couleur principale : typographies: menus et sous-menus : multilingue Un grand nombre de paramètres d'UI sont configurables. Se référer à votre contact pour plus d'informations footer / liens footer / réseaux sociaux
17. Préparation des contenus statiques Toutes les pages statiques de votre site sont directement éditables depuis Github option / tabs contenu affiché sur votre site ... … directement importé depuis votre fichier .html sur Github
18. Préparation du multilingue Chaque page de contenu ou de data-visualisation peut avoir une page correspondante dans une autre langue de votre choix. Chacune version de la même page est en fait un fichier .html distinct entreposé sur Github. Apiviz fera le "switch" entre les différents fichiers à importer en fonction de la langue indiquée dans le menu de navigation.
19. Calage des vues de data-visualisations ( supports d'accompagnement )
20. Calages des vues - options générales Différentes options de visualisation sont disponibles. Il est aussi à noter que certaines options non visibles ici ont un grand rôle dans l'UI générale de votre instance : par exemple la liste des images par défaut des fiches / objets. intitulés objets : vues disponibles : mélangeur : téléchargement du dataset :
21. Calages des vues - options filtres La barre de filtre est commune à toutes les vues de recherche sur un jeu de données champ : champ : champ : champ :
22. Calages des vues - vue tableur Vue tableur avec options de pagination des résultats champ : champ : champ : champ : champ : options / pagination :
23. Calages des vues - vue liste Prévisualisation des données sous forme de fiches synthétiques. Un clic sur une fiche renvoie vers la vue "détail" présentée plus loin champ : champ : champ : champ : options : options : options : images par défaut : champ : champ :
24. option vue "choropleth" Calages des vues - vue carte Visualisation cartographique des données dont plusieurs options sont configurables : clusters, heatmap, niveaux de zoom, légendes, ... Tous les points sont cliquables et ouvrent une prévisualisation (fiche à gauche). Un clic sur cette fiche renvoie vers la vue "détail" présentée plus loin. option calque "clusters" option calque "heatmap" options UI clusters options UI heatmap champ : champ : champ : champ :
25. Calages des vues - vue détail Vue détaillée d'un document. Tous les sous-espaces de la vue "détail" sont configurables et rattachables à un ou plusieurs champs du document à visualiser champ : champ : champ : champ : champ : champ : champ : champ : champ : image par défaut :
26. Calages des vues - vue graphiques (expérimental, ApexCharts) Visualisation de données agrégées (expérimental) config graphique 1 : texte graphique 1 : config graphique 2 : texte graphique 2 :
27. Back office de votre instance Apiviz
28. générateur de site - parcours utilisateur Générer un site Apiviz à partir d'un template Si vous désirez créer un nouveau site et que vous ne possédez qu'un identifiant sans configuration correspondante, vous pouvez utiliser le "générateur de site" d'Apiviz. Cet espace du back office vous permet de créer un site tournant sous Apiviz à partir d'un modèle de configuration existante (ou template). Une fois votre nouveau site créé vous pourrez ensuite le modifier en ligne via son propre back office. sélection du template parmi les modèles
29. back office - accueil Présentation générale Apiviz possède un back office permettant de modifier en ligne tous les éléments de configuration de votre site espace de login configuration du champ au format JSON sous-menus de configuration menu des principaux champs de configuration
30. Préparation de vos données, indexation et "API-fication"
31. Solidata API (backend) Solidata est un outil complémentaire à Apiviz de mise à disposition, de requête, et de gestion de vos données. Il s'agit d'une API Rest ouvrant différents endpoints propres à votre ou vos jeux de données : https:/ /solidata-api.co-demos.com/api/dso/documentation gestion d'un ensemble compilé de plusieurs datasets (DSO) gestion d'un dataset (DSI)
32. Solidata interface (frontend Solidata) Solidata possède également une interface en ligne permettant la mise à jour de vos données source ainsi que différentes opérations d'homogénéisation : https:/ /solidata.co-demos.com gestion d'un ensemble compilé de plusieurs datasets (DSO) gestion d'un dataset (DSI)
33. dataset ou DSI (fichier .csv) Préparation de vos jeux de données (DSI) Typiquement les données que vous chercherez à valoriser peuvent être préparées au format .csv, excel, ou sous la forme d'un point d'API livrant du JSON. Toujours habituellement, chacune des lignes de votre tableau représente un objet indexé qui pourra être visualisé avec précision depuis la vue "détail" présentée plus loin. Lors de l'accompagnement un point spécifique sera fait sur les colonnes permettant de correctement utiliser l'option "filtres" décrite plus loin. Enfin, des colonnes "lat" et "lon" sont nécessaires pour utiliser l'option "vue carte". Il est recommandé d'utiliser le site adresse.data.gouv pour géocoder votre fichier .csv colonne de type filtrage colonnes de type coordonnées geo colonne de type contenu
34. Import d'un jeu de données (DSI) dans Solidata Chacun des jeux de données à votre disposition (par exemple un tableur excel ou un fichier au format .csv) peut être importé à part dans Solidata en tant que "dataset input", ou DSI. Dans l'espace "données" de Solidata vous pouvez tour à tour : créer/importer un nouveau dataset, le prévisualiser, le mettre à jour, définir des droits d'édition, ou encore le supprimer. mise à jour des données prévisualisation des données métadonnées du dataset
35. Structuration de vos jeux de données dans Solidata (DSO) Vous pouvez assembler plusieurs DSI (dataset inputs) afin de créer un jeu de données composite et original, ou dataset output (DSO). Ce nouveau jeu de données utilisera pour tous les DSI un modèle de données commun (datamodel template, ou DMT). Dans l'espace "Projets d'ouverture de données" de Solidata vous devrez alors : 1) choisir le modèle de données qui s'appliquera à tous les DSI ; 2) choisir les différents jeux de données à assembler (les DSI) ; 3) cartographier les correspondances entre les différents champs du DMT et les intitulés de colonnes correspondants pour chaque DSI. modèle de données (DMT) jeu de données (DSI) mapping DMT/DSI publication du DSO
36. Modèle économique envisagé
37. mise en place initiale / accompagnement configurer votre site (selon complexité) soit environ 3 à 6 jours de prestation au TJM Pricing L'offre commerciale proposée ici vise à la fois à rendre accessible la valorisation de données aux grandes comme aux très petites structures (petites communes, associations) tout en permettant au projet de continuer à être développé entièrement en open source. Cette offre peut être cumulable avec des prestations plus ponctuelles d'accompagnement (design du site, traitement des données source, etc…) lors de la mise en place initiale de votre site. hébergement 1 site : valoriser entre 1 et 3 dataset(s) exposer des données visualiser des données 200 € TTC / mois 2000-5000 € TTC
38. Informations complémentaires
39. Votre contact Julien Paris Développeur fullstack jparis.py@gmail.com 06 83 65 84 91 Julien Paris est développeur fullstack indépendant. Il conçoit et développe des applications libres pour des associations, des structures publiques, ou autres structures para-publiques. Il s'intéresse notamment à l'ouverture des données (open data) et à la visualisation de données (data visualisation). Il développe principalement en Python et Javascript (Vue.js) des applicatifs backend ou frontend. https:/ /github.com/co-demos https:/ /github.com/JulienParis
40. Codes sources logo applicatif code source documentation Solidata - frontend https:/ /github.com/co-demos/solidata-frontend - - - Solidata - backend https:/ /github.com/co-demos/solidata-backend https:/ /co-demos.github.io/solidata-backend/ Apiviz - frontend https:/ /github.com/co-demos/apiviz-frontend https:/ /co-demos.github.io/apiviz-frontend Apiviz - backend https:/ /github.com/co-demos/apiviz-backend https:/ /co-demos.github.io/apiviz-backend/ Toktok https:/ /github.com/co-demos/toktok https:/ /co-demos.github.io/toktok/
41. https://docs.google.com/presentation/d/1Vg9p4haFwtCjMmk5jsetTgKqjuf1LeYrLtfUo2RYK34/edit?usp=sharing Lien vers la présentation pour commentaires et questions
42. Annexes
43. Compréhension du besoin (détail) • Le client dispose d'un ou de plusieurs jeux de données (potentiellement géolocalisées) distincts qu'il s'agit de valoriser sous la forme d'un site internet dédié, c'est-à-dire un site permettant à la fois de visualiser l'ensemble de ces données sous forme d'une cartographie mais aussi d'opérer des tris (filtres) ou encore d'afficher des pages de contenus statiques (description du projet, contacts, partenaires...). • A cette fin il est proposé au client d'utiliser la solution open source Apiviz / Solidata sous sa forme mutualisée ou SAAS : Solidata afin de servir les données via des points d'API dédiés, Apiviz afin de visualiser lesdites données sur un site internet complet et dédié à la data-visualisation. • L'implémentation est composée de plusieurs temps distincts : ◦ accompagnement au formatage des données client : accompagnement sur place ou en télé-conférence, définition des champs à afficher sur le site final, nomenclaturage des filtres et colonnes de tags, écriture de supports d'aide à la décision (correspondances entre champs des données et maquette d'Apiviz)... ◦ intégration des jeux de données client à Solidata et configuration de l'instance d'Apiviz spécifique pour le client : implémentation du modèle de données général dans Solidata, import des différents jeux de données client dans Solidata, configuration de l'instance d'ApiViz (data endpoints, contenus statiques, couleurs, vues, footer, filtres, menus, logo, ...) ◦ mise en production : intégration des contenus statiques produits et mis en ligne par le client (par ex. fichiers .html sur un repo Github), mise en ligne du site fonctionnant avec Apiviz sous l'URL fournie par le client"
44. Schéma général du système Apiviz / Solidata 3/ ApiViz frontend (votre site) récupère les contenus statiques directement depuis Github ; 1/ ApiViz frontend (votre site) récupère sa configuration personnalisée via l'API d'Apiviz backend ; 2/ ApiViz frontend (votre site) requête les données à visualiser sur l'API de Solidata ;
45. Pourquoi un tel système ? • Outils existants pour valoriser des données complexes et chers ; • Outils existants généralement orientés BI ; • Permettre à des acteurs publics ou d'intérêt général d'ouvrir et valoriser plus simplement et plus économiquement leur données ; • Benchmark : SELECTION OUTILS - dataviz / ETL / API