2f:Ta67,plot = Plot.plot({ width, height: width>1000 ? 0.6*width : width>500 ? 0.7*width : 350 , marginLeft: width>1000 ? 80 : width>500 ? 70 : 40, marginBottom: width>1000 ? 120 : width>500 ? 90 : 60, marginTop: width>1000 ? 60 : width>500 ? 40 : 30, marginRight: width>600 ? 60 : 40, y:{ticks:10, tickSize: width>1000 ? 15 : width>500 ? 10 : 5, grid: true, domain:[0.8,3.2], label:"Rapport des quotients H/F", labelArrow:false, tickFormat: d=>d.toFixed(1).replace(".",",")}, x: {axis: true, ticks:[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21], tickSize: width>1000 ? 15 : width>500 ? 10 : 5, label:"Âge", labelArrow: false, labelAnchor:"center"}, color: {legend: false, domain:domain, range:range}, marks: [ Plot.line(df,{filter: d=> checkbox.includes(d.period) ,x: "ageNum", y:"rHF", stroke:"period", curve:"catmull-rom", strokeWidth: width>1000 ? 5 : width>500 ? 3 : 2, channels: { period: {value:"period", label:""}, age: {value:"age", label:""}, qh: {value: "qxH", label:"Quotient Hommes:"}, qf: {value: "qxF", label:"Quotient Femmes:"}, rHF : {value: "rHF", label:"Rapport des quotients:"} }, tip:{format: { x: false,y: false, z:false, stroke:false, period:true, age: d=> `${d} an(s)`, qh: d=> `${d.toFixed(3)}`, qf: d=> `${d.toFixed(3)}` }, strokeWidth:0}}), //Plot.text(df, {filter: d=> d.periodNum===2 && d.ageEven===1, x: "ageNum", y: 0.7, text: "age", lineAnchor:"top", rotate: -50}), // Plot.text(df, {filter: d=> d.periodNum===2 && d.ageEven===1, x: "ageNum", y: 0.7, text: "age", lineAnchor:"top"}), Plot.text([width>800 ? "0" : "0"], {x:1, y:.71, lineAnchor:"top"}), Plot.text([width>800 ? "5-9" : "5\n|\n9"], {x:3, y:.71, lineAnchor:"top"}), Plot.text([width>800 ? "15-19" : "15\n|\n19"], {x:5, y:.71, lineAnchor:"top"}), Plot.text([width>800 ? "25-29" : "25\n|\n29"], {x:7, y:.71, lineAnchor:"top"}), Plot.text([width>800 ? "35-39" : "35\n|\n39"], {x:9, y:.71, lineAnchor:"top"}), Plot.text([width>800 ? "45-49" : "45\n|\n49"], {x:11, y:.71, lineAnchor:"top"}), Plot.text([width>800 ? "55-59" : "55\n|\n59"], {x:13, y:.71, lineAnchor:"top"}), Plot.text([width>800 ? "65-69" : "65\n|\n69"], {x:15, y:.71, lineAnchor:"top"}), Plot.text([width>800 ? "75-79" : "75\n|\n79"], {x:17, y:.71, lineAnchor:"top"}), Plot.text([width>800 ? "85-89" : "85\n|\n89"], {x:19, y:.71, lineAnchor:"top"}), Plot.text([width>800 ? "95-99" : "95\n|\n99"], {x:21, y:.71, lineAnchor:"top"}), Plot.ruleY([1]) ] })30:Tf5f,boxPlotGraph1 = htl.html `

${viewof checkbox}

${plot}

Source: Human Mortality Database.

`31:T6e8,filterLegend = ( domain, range, subdomain = null ) => { const defaultChecked = subdomain === null ? domain : subdomain; const value = new Map( domain.map(d => [d, defaultChecked.includes(d)]) ); const _set = () => set( node, [...value].filter(d => d[1]).map(d => d[0]) ); const oninput = e => { value.set(e.target.id, e.target.checked); _set(); }; const selectAll = () => { domain.forEach(d => value.set(d, true)); node.querySelectorAll("input[type=checkbox]") .forEach(cb => cb.checked = true); _set(); }; const selectNone = () => { domain.forEach(d => value.set(d, false)); node.querySelectorAll("input[type=checkbox]") .forEach(cb => cb.checked = false); _set(); }; const node = htl.html`

${domain.map((d, i) => htl.html`

${d}

`)}

`; _set(); return node; }; 32:Te06, 33:[{"id":"65295971557561b610c688664f9f0f4d99b06bc9a85a12e6050709e218cf433a2fda92ae5a0374eb7b7a612d890d8ac8496af33a8247d5bac6b550908bc02e91","href":"https://static.observableusercontent.com/files/65295971557561b610c688664f9f0f4d99b06bc9a85a12e6050709e218cf433a2fda92ae5a0374eb7b7a612d890d8ac8496af33a8247d5bac6b550908bc02e91","name":"data@2.csv","type":"text/csv","lastModified":1782816348975.721,"size":40903},{"id":"5557863d7aee5d5bcd152dc5189382899daf4b1826697c6be2bc473961fbb86509c5b9a20c3148f397379b46f75eb8fcd49115c3f85050f6bcf1f436d27426bf","href":"https://static.observableusercontent.com/files/5557863d7aee5d5bcd152dc5189382899daf4b1826697c6be2bc473961fbb86509c5b9a20c3148f397379b46f75eb8fcd49115c3f85050f6bcf1f436d27426bf","name":"data.csv","type":"text/csv","lastModified":1782802972446.801,"size":67023},{"id":"fa5318cb3c920bfaddad325ba5ebf704a8d852cc7fef86eb5e85657685745b18da0caafe7b49c53c7107a5686cf37ba9cf8eae4dd3a1a7a571469e751323a964","href":"https://static.observableusercontent.com/files/fa5318cb3c920bfaddad325ba5ebf704a8d852cc7fef86eb5e85657685745b18da0caafe7b49c53c7107a5686cf37ba9cf8eae4dd3a1a7a571469e751323a964","name":"data@1.csv","type":"text/csv","lastModified":1782803258739.771,"size":11796},{"id":"1d4d67f2b79550a3154a28d5f1f2d4a1aae7fc18bd8d04d61189aa33d0f713f89a3730766a6acb9e3586c5a24cf664f4d2e220c38d2acecb2685143153f06d8c","href":"https://static.observableusercontent.com/files/1d4d67f2b79550a3154a28d5f1f2d4a1aae7fc18bd8d04d61189aa33d0f713f89a3730766a6acb9e3586c5a24cf664f4d2e220c38d2acecb2685143153f06d8c","name":"data@3.csv","type":"text/csv","lastModified":1782817677160.446,"size":42675}] 2d:{"title":"Graphique interprété: Surmortalité des hommes","cells":[{"id":0,"value":"# Graphique interprété: Surmortalité des hommes ","pinned":false,"hidden":false,"mode":"md"},{"id":52,"value":"data2 = FileAttachment(\"data@3.csv\").csv({typed:true})","pinned":true,"hidden":false,"mode":"ojs"},{"id":54,"value":"df = data2.filter(d=>\n d.periodNum===2 ||\n d.periodNum===8 || \n d.periodNum===14 || \n d.periodNum===20 || \n d.periodNum===26 || \n d.periodNum===32 || \n d.periodNum===38 || \n d.periodNum===42 \n )","pinned":true,"hidden":false,"mode":"ojs"},{"id":5,"value":"//df = FileAttachment(\"data@1.csv\").csv({typed:true})","pinned":true,"hidden":false,"mode":"ojs"},{"id":21,"value":"domain = [...new Set(df.map(d=>d.period))]","pinned":true,"hidden":false,"mode":"ojs"},{"id":19,"value":"range = ['#fee0d2','#fcbba1','#fc9272','#fb6a4a','#ef3b2c','#cb181d','#a50f15','#67000d']","pinned":false,"hidden":false,"mode":"ojs"},{"id":38,"value":"viewof checkbox = filterLegend(domain, range, [\"1820-1824\", \"1910-1914\",\"1970-1974\", \"2020-2023\" ]) ","pinned":false,"hidden":false,"mode":"ojs"},{"id":7,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs"},{"id":64,"value":"$30","pinned":true,"hidden":false,"mode":"ojs"},{"id":34,"value":"function set(input, value) {\n input.value = value;\n input.dispatchEvent(new Event(\"input\", {bubbles: true}));\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":36,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":46,"value":"$32","pinned":false,"hidden":false,"mode":"html"}],"files":"$W33","stdlib":"1","titling":"auto"}