2d:null 2e:["$","title",null,{"children":"TP 3 — Encoder : de la donnée au dessin | Menigoz-Ewan | Observable"}] 33:T48d,## Plot, canal par canal Un graphique Plot, c'est **des données + des marques + des canaux**. Un **canal**, c'est une variable visuelle. Voilà la table de correspondance — c'est le tableau du CM3, avec les noms de l'outil : | Canal Plot | Variable visuelle | Niveau perceptif | Ce qu'elle sait porter | |---|---|---|---| | `x`, `y` | **Position** | quantitative | tout — c'est la meilleure | | `r` | **Taille** | quantitative, mais mal estimée | des ordres de grandeur | | `fill` en dégradé | **Valeur** (clarté) | ordinale | un ordre, pas un rapport | | `fill` en teintes | **Couleur** (teinte) | sélective | des catégories, aucun ordre | | `symbol` | **Forme** | sélective | des catégories | | `opacity` | **Grain** | ordinale | un ordre grossier | **La règle du CM3, en une ligne :** on ne peut pas percevoir un ordre si la variable visuelle n'est pas ordonnée, ni un rapport si elle n'est pas quantitative. Le squelette d'un graphique : Plot.plot({ marks: [ Plot.barY(donnees, { x: "categorie", y: "valeur" }) ] }) `barY`, `dot`, `line`, `cell`, `rectY` : ce sont les **marques**. Ce qui est entre accolades : les **canaux**.34:T476, **À toi** **L'épreuve.** Pour chacun des quatre graphiques, réponds à trois questions — **sans regarder les chiffres**, en te fiant à ce que tu vois : 1. Peux-tu **classer** les régions de la plus fournie à la moins fournie ? 2. Peux-tu dire que **l'Île-de-France vaut le double** de l'Auvergne - Rhône-Alpes ? (C'est vrai : 521 contre 251.) 3. Peux-tu repérer **une** région précise en un coup d'œil ? Puis conclus : **quel encodage pour quel usage ?** *Ta réponse, dans la cellule ci-dessous.*35:T414,## Tes trois graphiques **À toi** Pour chacun : le graphique, puis **deux lignes** disant quelle variable visuelle porte quelle donnée, et à quel niveau perceptif. **G1 — une grandeur par catégorie.** Au choix : par région, par type d'établissement, ou par département. Contrainte : justifie ton encodage **et** ton tri. **G2 — deux variables à la fois.** Par exemple l'année d'ouverture et l'effectif, ou l'effectif selon le type. Contrainte : **deux canaux au moins**, et dis lequel porte quoi. **G3 — une distribution.** Celle des effectifs (`effectif`). Un histogramme suffit. Contrainte : avant de la tracer, va voir la cellule suivante.36:T4cb,`effectif` n'est rempli que pour **1 374 implantations sur 2 507** — 55 %. Mais regarde le tableau ci-dessus : **le taux de remplissage n'est pas le même selon le type**. Environ 58 % pour les universités, 36 % pour les grands établissements, 24 % pour les COMUE. **À toi** Deux questions : 1. Si tu additionnes la colonne `effectif` par type, **quel type est le plus désavantagé** par ce trou ? 2. Ce n'est donc pas du manquant « au hasard ». Comment appelles-tu ça, et qu'est-ce que tu écris sous ton graphique G3 pour être honnête ? *Ta réponse, dans la cellule ci-dessous.*37:T55f,journalIA = ` 1. Quels outils / quels prompts — J ai utilise Gemini pour m accompagner sur la creation de mes premiers graphiques. Je lui ai donne le contexte du TP et les bouts de code du prof pour comprendre la logique des commandes Plot. Exemples de prompts : - Je n ai pas bien compris ce que je dois faire pour l exercice avec les quatre encodages, tu peux m'apporté plus de précisions ? ou bien donne moi les commandes a intégrer dans les champs des questions tout en m'expliquant le processus que cela creé. - Pour les cellules de justifications, reformule mes réponses pour donner un résultat simple, avec des phrases. Transforme mes expressions en un paragraphe, sans perdre le sens de la question et de la justification. 2. Ce que ça m'a apporté — L'IA m'a beaucoup aidé à comprendre le fonctionnement de la librairie Plot, notamment la différence entre les commandes groupY et binX. Cela m'a aussi permis de bien assimiler les règles de Bertin sur les variables visuelles et de repérer le fameux piège des données manquantes pour les effectifs selon les types d'établissements. 3. Ce que j'ai dû corriger — J'ai du demander à l'IA de reformuler mes réponses car j'ai pris l'habitude de prendre en "note" mes pensées (quelques mots bout à bout, court phrase...) pour qu'ensuite il puisse rédiger une réponse avec une bone syntaxe. `38:[{"id":"0bc602383222f347c78dc2515ab79cf1d8058db3e9d1d918bbfb4e563db25ceefe086bbd947937e21ea0f732f2d965c10d2efe126186a7eb599cedefcb7e4a46","href":"https://static.observableusercontent.com/files/0bc602383222f347c78dc2515ab79cf1d8058db3e9d1d918bbfb4e563db25ceefe086bbd947937e21ea0f732f2d965c10d2efe126186a7eb599cedefcb7e4a46","name":"fr-esr-implantations_etablissements_d_enseignement_superieur_publics.json","type":"application/json","lastModified":1786309754302.429,"size":3727925}] 31:{"id":"d19bd4a9cf14ac0e","slug":"tp-3-encoder-de-la-donnee-au-dessin","title":"TP 3 — Encoder : de la donnée au dessin","thumbnail":"a284768217a85af7db48e9f58cb12007313b0409cf698678919d42a8835de45f","access_level":"public","create_time":"$D2026-09-14T11:40:57.632Z","update_time":"$D2026-09-17T06:55:35.700Z","view_time":null,"first_public_time":"$D2026-09-14T11:41:02.006Z","has_unpublished_edits":null,"fork":{"id":"3c46a6326b55c60a","slug":"tp-3-encoder-de-la-donnee-au-dessin","title":"TP 3 — Encoder : de la donnée au dessin","owner":{"id":"29853dc62ffa3714","login":"mmi-montbeliard","name":"MMI Montbéliard"}},"stars":0,"starred":false,"owner":{"type":"team","id":"e52b4682809561a3","login":"menigoz-ewan","name":"Menigoz-Ewan","avatar_url":"https://avatars-next.observableusercontent.com/1aab2bbbf46a2e6eccfb01bb287b5cea5d27b85a93e5440682619c1ce0d7d10e","tier":"starter_2024"},"version":250,"publish_version":250,"role":null,"authored":false,"authors":[{"type":"individual","id":"f1842c0dcd2973e5","login":"menigoz-ewan","name":"Menigoz-Ewan","avatar_url":"https://avatars-next.observableusercontent.com/1aab2bbbf46a2e6eccfb01bb287b5cea5d27b85a93e5440682619c1ce0d7d10e","tier":null}],"members":[{"type":"team","id":"e52b4682809561a3","login":"menigoz-ewan","name":"Menigoz-Ewan","avatar_url":"https://avatars-next.observableusercontent.com/1aab2bbbf46a2e6eccfb01bb287b5cea5d27b85a93e5440682619c1ce0d7d10e","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"TP 3 — Encoder : de la donnée au dessin","cells":[{"id":0,"value":"# TP 3 — Encoder : de la donnée au dessin\n\nNouveau jeu de données, et tu vas le garder jusqu'au TP 5 : **les 2 561\nimplantations de l'enseignement supérieur public en France**. Ton IUT est\ndedans.\n\nAujourd'hui tu dessines pour la première fois. Une seule question te guide, et\nce n'est pas « quel type de graphique je fais » :\n\n> **Quelle variable visuelle porte quoi — et en est-elle capable ?**\n\nC'est la question du CM3. Plot est fait pour y répondre : ses **canaux**\n(`x`, `y`, `fill`, `r`, `opacity`) sont exactement les **variables visuelles**\nde Bertin.\n\n---\n\n## ⚠️ Avant toute chose : **forke ce notebook**\n\nBouton **Fork**, en haut à droite. Sinon rien n'est enregistré.\n**Ce notebook est ton rendu**, tu en déposeras le lien sur Moodle.\n\n⚠️ Dans les cellules de réponse, écris entre les **guillemets obliques** — pas\nentre ` ' ` ni ` \" `.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"esr = FileAttachment(\n \"fr-esr-implantations_etablissements_d_enseignement_superieur_publics.json\"\n).json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":163,"value":"","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":162,"value":"Inputs.table(esr)","pinned":true,"hidden":false,"mode":"ts","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"**Regarde d'abord.** 2 561 lignes. Fais défiler, trie sur `reg_nom`, sur\n`effectif`, sur `type_d_etablissement`.\n\nTrois choses à repérer tout de suite — tu les as apprises au TP 2 :\n\n1. Certaines lignes sont **entièrement vides** sauf deux champs. Combien ?\n2. La colonne `effectif` est **loin d'être remplie**. Combien manque-t-il ?\n3. Regarde `reg_nom`. « Aquitaine - Limousin - Poitou-Charentes »… ces régions\n existent-elles encore ? Qu'est-ce que ça te dit sur la **date** du fichier ?","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":91,"value":"## D'où viennent ces données\n\n| | |\n|---|---|\n| **Jeu** | *Implantations des établissements d'enseignement supérieur publics* |\n| **Producteur** | Ministère de l'Enseignement supérieur et de la Recherche |\n| **Licence** | Licence Ouverte / Etalab — réutilisation libre, **attribution obligatoire** |\n| **Page** | |\n| **Dernière mise à jour** | **25 octobre 2017** — le jeu est signalé « archivé » |\n\n⚠️ **Ces données ont neuf ans.** C'est pour ça que tu verras des régions qui\nn'existent plus. Ce n'est pas un défaut du fichier : c'est son âge, et c'est une\ninformation que **tu dois transmettre** à qui lira tes graphiques.\n\nLa ligne à écrire sous chacun d'eux :\n\n> Source : MESR, *Implantations des établissements d'enseignement supérieur\n> publics* (données arrêtées en 2017) · France métropolitaine.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":17,"value":"## code · nettoyage minimal","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":19,"value":"// Les 54 lignes fantômes n'ont ni département, ni type, ni coordonnées.\n// On les écarte — et on l'écrira dans le rendu.\nimplantations = esr\n .filter((d) => d.dep_id)\n .map((d) => ({\n ...d,\n dep: d.dep_id.replace(/^D0?/, \"\"), // \"D059\" → \"59\"\n annee: d.date_ouverture ? +d.date_ouverture.slice(0, 4) : null\n }))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"({\n total: esr.length,\n exploitables: implantations.length,\n ecartees: esr.length - implantations.length,\n avecEffectif: implantations.filter((d) => d.effectif).length\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"$33","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":94,"value":"aide(\"partieC\", \"Plot, en une page\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":103,"value":"aide(\"lesCanaux\", \"Les canaux = les variables visuelles\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"## code · premiers pas","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":32,"value":"// Combien d'implantations par région ?\nparRegion = d3\n .rollups(\n implantations,\n (v) => v.length,\n (d) => d.reg_nom\n )\n .map(([region, n]) => ({ region, n }))\n .sort((a, b) => d3.descending(a.n, b.n))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":106,"value":"aide(\"agreger\", \"rollups et déstructurage\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":108,"value":"aide(\"objetLitteral\", \"Pourquoi ({ … }) et pas { … }\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"Plot.plot({\n marginLeft: 240,\n marks: [\n Plot.barX(parRegion, { x: \"n\", y: \"region\", sort: { y: \"-x\" } }),\n Plot.ruleX([0])\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":36,"value":" **À toi** — Trois cellules :\n1. le nombre d'implantations par `type_d_etablissement` ;\n2. le même graphique, mais limité aux **cinq** premiers types ;\n3. le nombre d'implantations par **décennie d'ouverture** (`annee`).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":40,"value":"// Le nombre d'implantations par type d'établissement\nex1 = Plot.plot({\n marginLeft: 350,\n marks: [\n Plot.barX(implantations, Plot.groupY({ x: \"count\" }, { y: \"type_d_etablissement\", sort: { y: \"-x\" } })),\n Plot.ruleX([0])\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":42,"value":"// Le même graphique à barres, limité aux cinq premiers types\nex2 = Plot.plot({\n marginLeft: 300,\n marks: [\n Plot.barX(implantations, Plot.groupY({ x: \"count\" }, { y: \"type_d_etablissement\", sort: { y: \"-x\", limit: 5 } })),\n Plot.ruleX([0])\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"// Le nombre d'implantations par décennie d'ouverture\nex3 = Plot.plot({\n marks: [\n Plot.rectY(implantations, Plot.binX({ y: \"count\" }, { x: \"annee\" })),\n Plot.ruleY([0])\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":38,"value":"## Le même fait, quatre encodages","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":118,"value":"// 1 · POSITION — la longueur d'une barre\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":120,"value":"// 2 · TAILLE — le rayon d'un cercle\nPlot.plot({\n height: 300,\n marginLeft: 240,\n width: 460,\n x: { axis: null },\n r: { range: [0, 22] },\n marks: [\n Plot.dot(parRegion, { x: () => 0, y: \"region\", r: \"n\", sort: { y: \"-r\" } })\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":122,"value":"// 3 · VALEUR — la clarté d'un aplat\nPlot.plot({\n height: 300,\n marginLeft: 240,\n width: 460,\n x: { axis: null },\n color: { scheme: \"blues\", legend: true },\n marks: [\n Plot.cell(parRegion, {\n x: () => 0,\n y: \"region\",\n fill: \"n\",\n sort: { y: \"-fill\" }\n })\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":124,"value":"// 4 · TEINTE — la couleur d'un aplat\nPlot.plot({\n height: 300,\n marginLeft: 240,\n width: 460,\n x: { axis: null },\n color: { scheme: \"rainbow\", legend: true },\n marks: [\n Plot.cell(parRegion, {\n x: () => 0,\n y: \"region\",\n fill: \"n\",\n sort: { y: \"-fill\" }\n })\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":126,"value":"$34","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":50,"value":"rEncodages = `\n1 · Position — Oui, on peut les classer facilement, on voit bien que la première barre fait le double de la seconde. Mais non, ce n'est pas immédiat pour repérer une région précise car il faut lire les étiquettes.\n\n2 · Taille — Oui, on peut classer du plus grand au plus petit. Mais l'œil a beaucoup de mal à voir qu'un cercle est exactement le double d'un autre.\n\n3 · Valeur (clarté) — Oui, le dégradé permet de voir l'ordre. En revanche, on ne peut pas déduire une proportion mathématique juste avec des nuances.\n\n4 · Teinte — Non, impossible de classer car un arc-en-ciel n'a pas d'ordre logique, on ne voit aucune proportion. Mais oui, on repère une région immédiatement grâce à sa couleur unique.\n\nMa conclusion — La position est le seul choix fiable pour montrer des quantités et des proportions exactes. La taille et la clarté donnent juste un ordre vague. Et la teinte ne doit jamais servir pour des nombres, elle sert uniquement à différencier des catégories.\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"$35","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":56,"value":"// G1 — une grandeur par catégorie\ng1 = Plot.plot({\n marginLeft: 250,\n marks: [\n Plot.barX(implantations, Plot.groupY({ x: \"count\" }, { y: \"reg_nom\", sort: { y: \"-x\" } })),\n Plot.ruleX([0])\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":58,"value":"// G2 — deux variables à la fois\ng2 = Plot.plot({\n marks: [\n Plot.dot(implantations, { x: \"annee\", y: \"effectif\" }),\n Plot.ruleY([0])\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":60,"value":"// G3 — une distribution\ng3 = Plot.plot({\n marks: [\n Plot.rectY(implantations, Plot.binX({ y: \"count\" }, { x: \"effectif\" })),\n Plot.ruleY([0])\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":136,"value":" *Ta justification, dans la cellule ci-dessous.*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":138,"value":"rG1 = `\nLe graphique — Le total des établissements pour chaque région.\n\nL'encodage — L'axe Y affiche la région, qui est une variable qualitative nominale. L'axe X affiche le compte, qui est une variable quantitative absolue. J'ai trié du plus grand au plus petit pour voir le classement direct. La longueur des barres est le truc le plus fiable pour que notre oeil compare des montants sans se tromper.\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":141,"value":" *Ta réponse, dans la cellule ci-dessous.*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":144,"value":"rG2 = `\nLe graphique — L'évolution du nombre d'étudiants selon l'année d'ouverture.\n\nL'encodage — L'axe X montre l'année, qui est une variable quantitative relative. L'axe Y montre le nombre d'étudiants, qui est une variable quantitative absolue. Placer des points sur une grille avec ces deux axes est la méthode la plus précise pour notre cerveau quand il faut lire deux nombres en même temps.\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":147,"value":" *Ta réponse, dans la cellule ci-dessous.*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":149,"value":"rG3 = `\nLe graphique — La répartition du nombre d'étudiants dans les écoles avec un histogramme.\n\nL'encodage — L'axe X découpe les effectifs en plusieurs tranches. L'axe Y donne le compte pour chaque tranche avec la hauteur de la barre, ce qui est une variable quantitative absolue. Le gros piège ici c'est que presque la moitié des écoles n'ont pas leur nombre d'étudiants rempli dans le fichier, donc ce dessin ne montre qu'une partie de la réalité.\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":62,"value":"## Le piège de l'effectif","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":64,"value":"// Combien d'implantations ont un effectif renseigné, par type ?\nd3\n .rollups(\n implantations,\n (v) => ({\n total: v.length,\n avecEffectif: v.filter((d) => d.effectif).length\n }),\n (d) => d.type_d_etablissement\n )\n .map(([type, o]) => ({ type, ...o, taux: o.avecEffectif / o.total }))\n .sort((a, b) => d3.descending(a.total, b.total))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":151,"value":"aide(\"lesTrous\", \"Valeurs manquantes et NaN\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":66,"value":"$36","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":68,"value":"rManquant = `\n1. Si on additionne tout, le type le plus désavantagé est celui des COMUE. Avec seulement 24% de remplissage, la grande majorité de leurs étudiants n'apparaîtra pas dans le total, contrairement aux universités qui sont remplies à 58%.\n\n2. Quand le manque de données n'est pas réparti au hasard et touche plus une catégorie qu'une autre, on appelle ça un biais. Sous mon graphique G3, je dois écrire une phrase d'avertissement type : Attention, ce graphique est biaisé car il manque la moitié des effectifs, et cette absence pénalise surtout certains types d'établissements qui se retrouvent sous-représentés.\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"## Synthèse\n\nEn trois lignes : **quel canal tu utiliseras par défaut** dans tes prochains\ngraphiques, et **dans quel cas tu accepteras d'en changer.**\n\n *Ta réponse, dans la cellule ci-dessous.*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":73,"value":"synthese = `Par défaut j'utiliserai toujours la position avec les axes horizontaux et verticaux car c'est la seule méthode qui permet à notre cerveau de comparer des vraies quantités sans se tromper.\nJe n'accepterai d'utiliser un autre canal comme la couleur ou la taille que si mes deux axes sont déjà pris par d'autres variables, ou si j'ai juste besoin de différencier des catégories avec des teintes différentes.\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":75,"value":"## Journal IA\n\nÀ remplir même si tu n'as rien utilisé.\nSans ce bloc, le rendu n'est pas évalué.\n\n *Ta réponse, dans la cellule ci-dessous.*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":77,"value":"$37","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":79,"value":"QUESTIONS = [\n [\"Les quatre encodages\", rEncodages],\n [\"G1 · une grandeur\", rG1],\n [\"G2 · deux variables\", rG2],\n [\"G3 · une distribution\", rG3],\n [\"Le piège de l'effectif\", rManquant],\n [\"Synthèse\", synthese],\n [\"Journal IA\", journalIA]\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":81,"value":"manques = {\n const rempli = (s) =>\n (s ?? \"\").split(\"\\n\").some((l) => l.trim() && !/[—:]\\s*$/.test(l.trim()));\n\n const trous = [\n ...QUESTIONS.filter(([, texte]) => !rempli(texte)).map(([nom]) => nom),\n ...[\n [\"ex1\", ex1],\n [\"ex2\", ex2],\n [\"ex3\", ex3]\n ]\n .filter(([, v]) => v == null)\n .map(([n]) => `l'exercice ${n}`),\n ...[\n [\"G1\", g1],\n [\"G2\", g2],\n [\"G3\", g3]\n ]\n .filter(([, v]) => v == null)\n .map(([n]) => `le graphique ${n}`)\n ];\n\n return trous.length\n ? md`⚠️ **${trous.length} élément(s) à compléter** : ${trous.join(\" · \")}`\n : md`✅ **Ton rendu est complet.** Dépose le lien de ce notebook.`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"# Synthèse des réponses","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":85,"value":"// Ton rendu, tel qu'il sera lu\nrendu = md`${[\n ...QUESTIONS.map(\n ([nom, texte]) => `### ${nom}\\n\\n${(texte ?? \"\").trim() || \"_(à remplir)_\"}`\n ),\n `---`,\n `### Le code`,\n `| | Résultat |\\n|---|---|\\n` +\n [\n [\"ex1\", ex1],\n [\"ex2\", ex2],\n [\"ex3\", ex3],\n [\"g1\", g1],\n [\"g2\", g2],\n [\"g3\", g3]\n ]\n .map(([n, v]) => `| \\`${n}\\` | ${apercu(v)} |`)\n .join(\"\\n\")\n].join(\"\\n\\n\")}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":96,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":161,"value":"// De quoi rendre un résultat de code lisible dans le résumé\napercu = (v) => {\n if (v == null) return \"_(à faire)_\";\n if (v instanceof Element)\n return `graphique (\\`<${v.tagName.toLowerCase()}>\\`)`;\n if (v instanceof Map) return `Map de ${v.size} entrées`;\n if (Array.isArray(v))\n return v.length <= 3\n ? \"`\" + JSON.stringify(v) + \"`\"\n : `tableau de ${v.length} éléments`;\n return \"`\" + String(v).slice(0, 70) + \"`\";\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"import { aide } from \"@mmi-montbeliard/antiseche-observable-javascript-et-plot\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W38","stdlib":"2","titling":"auto"}} 32:"$31:body"