Des outils et des exemples
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2Fadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%2F8ae7fff4-dcec-4c72-9e24-1b5a3323baee%2Fplaquette_n3.jpg%3Ftable%3Dblock%26id%3D26d62d6b-1d8e-4dd6-abc4-af5969579a93%26spaceId%3Dadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%26expirationTimestamp%3D1739628000000%26signature%3DtsDeNOGL5bAa4AVs32SI7mpcDId9FuVR5Uih04ekBaU?table=block&id=26d62d6b-1d8e-4dd6-abc4-af5969579a93&cache=v2)
Dans moins dâun mois, le Hackaviz 2020 organisĂ© par lâassociation Toulouse Dataviz va dĂ©marrer !
Un Hackaviz ? KĂ©zako ? Câest un concours de visualisation de donnĂ©es en temps limitĂ©, seul ou en Ă©quipe, dotĂ© de rĂ©compenses, ouvert Ă un trĂšs large public.
Le principe ? Tu as 10 jours pour raconter une histoire avec des graphiques (seul ou en Ă©quipe) Ă partir dâun jeu de donnĂ©es original qui regroupe des donnĂ©es ouvertes concernant les communes de la rĂ©gion Occitanie.
Si tu n'es pas encore inscrit, c'est par lĂ !
Pour tâaccompagner dans cette aventure, on te concocte une newsletter hebdomadaire Ă lire en 5 minutes avec des ressources (prĂ©sentĂ©es pour la plupart lors de nos meetups đ) pour approfondir le sujet : de vraies petites pĂ©pites !
Le mot d'introduction
A la fois pour la manipulation des donnĂ©es, leur analyse, leur exploration et leur reprĂ©sentation finale, tu vas avoir besoin d'outils ! Chacun a ses petites prĂ©fĂ©rences, et le Hackaviz est peut-ĂȘtre l'opportunitĂ© d'approfondir ce que tu connais dĂ©jĂ ... ou d'en essayer de nouveaux ! Cette semaine, on te donne des ressources pour trouver des outils, et encore d'autres exemples de visualisations đ
Les outils utilisés lors des Hackaviz précédents
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2Fadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%2F463ab5c6-bd4c-4415-a125-d1a11314b029%2Fplanche_outils.jpg%3Ftable%3Dblock%26id%3D2bcf28f5-450d-4114-af8d-0a5df24e6287%26spaceId%3Dadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%26expirationTimestamp%3D1739628000000%26signature%3DlYgEMYXvVyO7it81fttJDe_Mx_5bvKDQi-2KrWDOzvs?table=block&id=2bcf28f5-450d-4114-af8d-0a5df24e6287&cache=v2)
Outils de dataviz : l'embarras du choix!
Alors bien sĂ»r certains ont un niveau plus avancĂ© que dâautres dans la visualisation de donnĂ©es et la maĂźtrise dâoutils, mais chacun a sa chance, mĂȘme celui qui voudra utiliser un papier et des crayons de couleur ! Le plus important est de rĂ©ussir Ă faire passer son message et sans essayer de tromper le jury đ
lors des hackaviz 2018 et 2019, 40% des visualisations proposées étaient statiques et 60% interactives.
Pour info, voici les outis qui ont été utilisés lors du Hackaviz 2018 et 2019 :
![Le classement des outils de dataviz utilisés lors des Hackaviz 2018 et 2019](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2Fadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%2F5abeaf94-adcb-4c90-9d6a-c7a0c06b0051%2FCapture.jpg%3Ftable%3Dblock%26id%3D655ae73a-f405-4439-a74a-8811c48b3c05%26spaceId%3Dadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%26expirationTimestamp%3D1739628000000%26signature%3D-_Uq4OyM7-rlXSvWqsOzFNGRmAvtkQKj-HgfQ-BIoWg?table=block&id=655ae73a-f405-4439-a74a-8811c48b3c05&cache=v2)
Â
Pour aller plus loin
Â
Initiation au package âShinyâ de R
RĂ©sumĂ© : «Shiny is good for you ! », telle pourrait ĂȘtre la devise de cet outil de crĂ©ation de visualisations interactives, tant il est facile de se lâapproprier. Je vous propose une introduction ludique et pratique Ă shiny â lâun des packages les plus incroyables et probablement le plus vivant de la communautĂ© R. Il suffit en effet de quelques minutes pour crĂ©er et dĂ©ployer sur le web une application shiny qui permettra dâinteragir avec nâimporte quel type de graphique (ou table, ou texte) crĂ©Ă© sous R. Ce Meetup est bĂąti sur un atelier de formation que jâai animĂ© rĂ©cemment pour un public ne connaissant pas R et est donc accessible Ă tous.
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2Fadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%2Fc24fe2aa-e55f-495a-89cd-0504ef076528%2FCapture4.png%3Ftable%3Dblock%26id%3Dc3b11e5e-bac0-4aec-bfe1-d75a0f169d51%26spaceId%3Dadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%26expirationTimestamp%3D1739628000000%26signature%3D_uQo1F78NiaQAKqP-CJqN6bc5m294EjgxA_3uCocgfk?table=block&id=c3b11e5e-bac0-4aec-bfe1-d75a0f169d51&cache=v2)
Intervenant : Christophe Bontemps, ingénieur de recherche (économétrie) à Toulouse School of Economics (INRA)
Â
React et d3js
RĂ©sumĂ© : React and d3jsLes deux sont de bons outils pour le dĂ©veloppeur webReact (2013) et D3 (2011) sont deux contributions majeures au dĂ©veloppement javascript et Ă lâUX. Vous nâaurez pas de difficultĂ©s Ă trouver des centaines de milliers de dĂ©veloppeurs pour en tĂ©moigner. D3 et React ne jouent pas dans la mĂȘme catĂ©gorie:React vise Ă fournir un framework de composants rĂ©utilisables de gestion dâinterface web sous forme dâun langage qui combine html et javascript: JSX. D3 est une technologie de manipulation/ affichage de donnĂ©es et dâassemblage de composants pour la visualisation dans le navigateur. Ces deux lĂ Ă©tant les plus populaires dans leurs domaines, ils devraient former un couple fantastique⊠Il faut les marier !! Mais il y a un Ă©lĂ©phant dans la salle de mariage: Câest le DOM. D3 le met Ă jour directement de maniĂšre parfois trĂšs Ă©troite et subtile comme dans les transitions par exemple. React gĂšre un DOM « virtuel » qui simplifie et optimise lâaffichage et le rafraĂźchissement. Ou les Pacser ? Quelles sont les approches possibles ? Il en existe plusieurs qui possĂšdent chacune leurs avantages et leurs dĂ©fauts.
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2Fadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%2Fc993b9ed-aaa6-4a26-a451-1dc3b1f2fe3d%2FIMG_3451.jpg%3Ftable%3Dblock%26id%3D437096b5-fb5a-45cc-9420-4a6f20d29a45%26spaceId%3Dadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%26expirationTimestamp%3D1739628000000%26signature%3DLMyW8Rc8Tm5gqXqVBvEMWixu3IuSH1pR9yzDGsQOfcQ?table=block&id=437096b5-fb5a-45cc-9420-4a6f20d29a45&cache=v2)
Slides : lien
Intervenant : Alain Roan
Observablehq, "le notebook magique" de la dataviz
RĂ©sumĂ© : Observablehq, est un environnement de dĂ©veloppement Dataviz collaboratif tout en un dans le navigateur. Le monde de la dataviz sâest appropriĂ© cette plateforme trĂšs innovante en quelques mois. Une fois franchi la barriĂšre dâĂ©trangetĂ©, vous ne pourrez plus vous en passer⊠Observablehq, la derniĂšre aventure de Mike Bostock (lâauteur de d3js) est un sorte de tableur oĂč chaque cellule est un fragment de code javascript. Il nâest pas nĂ©cessaire dâĂȘtre un dĂ©veloppeur javascript pour suivre ces prĂ©sentations et surtout pour tirer profit de lâincroyable collection de notebooks existants prĂȘt Ă ĂȘtre adaptĂ©s Ă vos donnĂ©es ou Ă vos variations.
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2Fadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%2Feb677edd-e79f-47d6-abb7-2491f0f2dbaf%2FIMG_7427.jpg%3Ftable%3Dblock%26id%3Da4de6ec4-a959-4125-9606-40bd8b38544b%26spaceId%3Dadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%26expirationTimestamp%3D1739628000000%26signature%3DfjyXadONBurA0LcKXwUOdXigtyozx-mTug85_K9-BxU?table=block&id=a4de6ec4-a959-4125-9606-40bd8b38544b&cache=v2)
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2Fadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%2F8df4a9e9-548d-49b3-a9db-c19ab82517d6%2FIMG_7449.jpg%3Ftable%3Dblock%26id%3D628679bf-28eb-427c-aaf7-cdea1fd547e8%26spaceId%3Dadba2cb3-b809-41d0-b7a2-c0e7bfb7edbc%26expirationTimestamp%3D1739628000000%26signature%3D_Is9N1Mg0zuEfhSnpI28Tcy7nQueOn9-899qPnBngT4?table=block&id=628679bf-28eb-427c-aaf7-cdea1fd547e8&cache=v2)
Intervenant :
Alain Roan â (perceptible.fr) prĂ©sente les principes techniques de cette plateforme et en quoi elle diffĂšre, Ă dessein, du javascript sur quelques exemples.
Alain Ottenheimer (datasens ) rĂ©alise une visualisation Ă partir dâun jeu de donnĂ©es et montre comment publier le rĂ©sultat sur un site web.
Â
Plusieurs lectures en cours - Ă suivre