2b:null 2c:["$","title",null,{"children":"Notebook du cours 3 (25-26) | liris | Observable"}] 31:T6ee,chart = { const height = 500 const margin = ({top: 20, right: 30, bottom: 30, left: 40}) const data = [{"cat":"A", "val": 1, "val2": 13}, {"cat":"B", "val": 1, "val2": 34}, {"cat":"C", "val": 2, "val2": 11}, {"cat":"D", "val": 1, "val2": 35}, {"cat":"E", "val": 4, "val2": 35}] const y = d3.scaleLinear().domain([0, d3.max(data, d => d[valeur])]).range([height - margin.bottom, margin.top]) const x = d3.scaleBand().domain(new Set(data.map(d => d.cat))).range([margin.left, width - margin.right]) const c = d3.scaleOrdinal(d3.schemeCategory10) const svg = d3.create("svg") .attr("viewBox", [0, 0, width, height]); const yAxis = g => g .attr("transform", `translate(${margin.left},0)`) .call(d3.axisLeft(y)) const xAxis = g => g .attr("transform", `translate(0,${height - margin.bottom})`) .call(d3.axisBottom(x)) svg.append("g") .call(xAxis); svg.append("g") .call(yAxis); svg.selectAll("rect").data(data).enter().append("rect") .attr("x", (d, i) => { return x(d.cat) }) .attr("y", (d, i) => { return height - margin.bottom - y(d[valeur]) }) .attr("height", (d, i) => { return y(d[valeur]) }) .attr("width", x.bandwidth()-2) .attr("fill", d => c(d.cat)) svg.selectAll("#rect-legend").data(data).enter().append("rect") .attr("x", (d, i) => { return 1000 }) .attr("y", (d, i) => { return 50 * i }) .attr("height", (d, i) => { return 40 }) .attr("width", 40) .attr("fill", d => c(d.cat)) svg.selectAll("#text-legend").data(data).enter().append("text") .attr("x", (d, i) => { return 1050 }) .attr("y", (d, i) => { return 25 + 50 * i }) .text(d => d.cat) return svg.node(); }32:[] 2f:{"id":"3ae76e68284d7ebc","slug":null,"title":"Notebook du cours 3 (25-26)","thumbnail":"4eaa56c14f4a9451f3f07b3066ff5ede767b035fa08ee42f4aef57b2bb68e9a2","access_level":"public","create_time":"$D2026-01-19T08:33:35.461Z","update_time":"$D2026-01-19T11:07:09.760Z","view_time":null,"first_public_time":"$D2026-01-19T10:24:01.269Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"fdc7daf8ebeefffd","login":"liris","name":"liris","avatar_url":"https://avatars-next.observableusercontent.com/7d8700f03d5c401c870c65da172434d81d16d724fac65823ac229570c96f68b6","tier":"education_2026"},"version":198,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"560201c9c61a188e","login":"romsson","name":"Romain Vuillemot","avatar_url":"https://avatars-next.observableusercontent.com/3b127750f8c67597cf2e60d4296f87cde15f59cdb4d1853063922cce5489fb4b","tier":null}],"members":[{"type":"team","id":"fdc7daf8ebeefffd","login":"liris","name":"liris","avatar_url":"https://avatars-next.observableusercontent.com/7d8700f03d5c401c870c65da172434d81d16d724fac65823ac229570c96f68b6","tier":"education_2026","role":"editor"},{"type":"individual","id":"560201c9c61a188e","login":"romsson","name":"Romain Vuillemot","avatar_url":"https://avatars-next.observableusercontent.com/3b127750f8c67597cf2e60d4296f87cde15f59cdb4d1853063922cce5489fb4b","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Notebook du cours 3 (25-26)","cells":[{"id":0,"value":"# Notebook du cours 3 (25-26)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"d3.version","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":24,"value":"{\n let code_svg = \"\"\n return html`${code_svg}`\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":49,"value":"y = d3.scaleLinear().domain([0, 100]).range([0, 500])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":51,"value":"x = d3.scaleBand().domain([\"A\", \"B\", \"C\"]).range([0, 100])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"x(\"C\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":110,"value":"c = d3.scaleOrdinal(d3.schemeCategory10)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":115,"value":"c(\"C\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":120,"value":"{\n const svg = d3.create(\"svg\")\n const data = [{\"cat\":\"A\", \"val\": 1},{\"cat\":\"B\", \"val\": 10}, {\"cat\":\"C\", \"val\": 2}, {\"cat\":\"D\", \"val\": 15}, {\"cat\":\"E\", \"val\": 45}]\n const y = d3.scaleLinear().domain([0, d3.max(data, d => d.val)]).range([0, 130])\n const x = d3.scaleBand().domain(new Set(data.map(d => d.cat))).range([0, 200])\n \n svg.selectAll(\"rect\").data(data).enter().append(\"rect\")\n .attr(\"x\", (d, i) => { return x(d.cat) })\n .attr(\"y\", (d, i) => { return 130 - y(d.val) })\n .attr(\"height\", (d, i) => { return y(d.val) })\n .attr(\"width\", x.bandwidth()-2)\n \n return svg.node()\n}\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":161,"value":"viewof valeur = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":166,"value":"valeur","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":138,"value":"$31","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1"}} 30:"$2f:body"