2f:Tf74,plot4 = Plot.plot({ y: { grid: false, reverse: true, grid: false}, x: {tickFormat: Math.abs, axis: null, grid: false}, //title: md`### Pyramide des âges du pop&soc 620` , marginLeft: 50, marginRight: 50, marginTop: 60, marginBottom: mBottom, width, height: height2, label: null, marks: [ Plot.axisX({ticks: [ -100000, -200000, -300000, -400000, -500000], tickFormat: d => Math.abs(d)/1000, fill: "transparent", dx:-dX, dy:0}), Plot.axisX({ ticks: [ 100000, 200000, 300000, 400000, 500000], tickFormat: d => Math.abs(d)/1000, fill: "transparent", dx: dX, dy:0}), Plot.axisY({ frameAnchor: "middle", dx: 32, tickSize: 30, ticks: [0,10,20,30,40,50,60,70,80,90,100], label: null, stroke: "white", textStroke: "white", textStrokeWidth: 0, fontSize: 14, textAnchor: "middle" }), Plot.text(["↑ Ages"], { frameAnchor: "top", dy: -20, dx: -4, fontSize:labSize }), Plot.barX(df, { x: (d) => -d.hommes, y: "age", dx: -27, channels: {Age: {value: 'age', label: 'Age:'}, anneeLab: {value: "anneeLab", label: 'Année de naissance:'}, Hommes: {value: 'hommes', label: "Nombre d'hommes:"}, }, fill: color[0], fillOpacity: 1, stroke: color[0], strokeWidth: 2 , rx:.5, inset:0, tip: {format: {x: false, y: false, Hommes: (d) => `${d.toLocaleString("fr-FR")}`},anchor: "top", stroke: "black", fontSize:12}}), Plot.barX(df, { x: (d) => d.femmes , y: "age", dx: 27, channels: {Age: {value: 'age', label: 'Age:'}, anneeLab: {value: "anneeLab", label: 'Année de naissance:'}, Femmes: {value: 'femmes', label: 'Nombre de femmes:'}}, fill: color[0], fillOpacity: 1, stroke: color[0], strokeWidth: 2 , rx:.5, inset:0, tip: {format: {x: false, y: false, Femmes: (d) => `${d.toLocaleString("fr-FR")}`}, anchor: "bottom", stroke: "black"} }), Plot.image(df,{ x: "xc", y: "yc" , //src: question, channels: {xc: {value: 'xx', label: ''}, yc: {value: 'xy', label: ''}, comment: {value: 'comment', label: "" }} , dx:+20, r: radius, tip: {format: {x: false, y: false, comment: true}, lineWidth: 20, dx: +15}, anchor: "top", title: (d) => [d.comment].join("\n\n")}), Plot.text(['Femmes →'], {x: d=> 200000, y: d=>100, dy: -20.5, textAnchor: "start", fontWeight:600, fontSize: labSize}), Plot.text(['← Hommes'], {x: d=> -200000, y: d=>100, dy: -20.5, textAnchor: "end", fontWeight: 600, fontSize: labSize}), Plot.text(["Effectifs (en milliers)"], { frameAnchor: "bottom", dy:50, fontSize: labSize }), Plot.text(["500"], {x: d => -500000, y:d => 0, dy:24, dx: -dX, fontSize: popSize}), Plot.text(["400"], {x: d => -400000, y:d => 0, dy:tick, dx: -dX, fontSize: popSize}), Plot.text(["300"], {x: d => -300000, y:d => 0, dy:24, dx: -dX, fontSize: popSize}), Plot.text(["200"], {x: d => -200000, y:d => 0, dy:tick, dx: -dX, fontSize: popSize}), Plot.text(["100"], {x: d => -100000, y:d => 0, dy:24, dx: -dX, fontSize: popSize}), Plot.text(["500"], {x: d => 500000, y:d => 0, dy:24, dx: dX, fontSize: popSize}), Plot.text(["400"], {x: d => 400000, y:d => 0, dy:tick, dx: dX, fontSize: popSize}), Plot.text(["300"], {x: d => 300000, y:d => 0, dy:24, dx: dX, fontSize: popSize}), Plot.text(["200"], {x: d => 200000, y:d => 0, dy:tick, dx: dX, fontSize: popSize}), Plot.text(["100"], {x: d => 100000, y:d => 0, dy:24, dx: dX, fontSize: popSize}), ] }) 30:T682,31:Ta9a,Plot.plot({ marginLeft:10, marginRight:10, marfginBottom:10, width: 600, height: 0.725*600, x: {axis: false}, y: {axis: false, grid: true}, marks: [ () => htl.svg` `, Plot.areaX(df, { x: (d) => -d.hommes -15000, y: d=> d.age-2, dx: -5, curve:'step', fill: "#ffcade", fillOpacity: 1, stroke: "black", strokeWidth: .5 , }), Plot.areaX(df, { x: (d) => d.femmes +15000, y: d=> d.age -2 , dx: 5, curve:'step', fill: "#ffcade", fillOpacity: 1, stroke: "black", strokeWidth: .5 , }), Plot.areaX(df, { x: (d) => -d.hommes -10000, y: d=> d.age-1, dx: -5, curve:'step', fill: color[1], fillOpacity: 1, stroke: "black", strokeWidth: .5 , }), Plot.areaX(df, { x: (d) => d.femmes +10000, y: d=> d.age -1 , dx: 5, curve:'step', fill: color[1], fillOpacity: 1, stroke: "black", strokeWidth: .5 , }), Plot.areaX(df, { x: (d) => -d.hommes, y: "age", dx: -5, curve:'step', fill: "url(#gradient)", fillOpacity: 1, stroke: "black", strokeWidth: .5 , }), Plot.areaX(df, { x: (d) => d.femmes, y: "age", dx: 5, curve:'step', fill: "url(#gradient)", fillOpacity: 1, stroke: "black", strokeWidth: .5 , }), Plot.ruleY([0], {x1: -5000, x2: 5000, y:100, strokeWidth:2, stroke: color[0]}), Plot.ruleY([0], {x1: -5000, x2: 5000, y:90, strokeWidth:2}), Plot.ruleY([0], {x1: -5000, x2: 5000, y:80, strokeWidth:2, stroke: color[0]}), Plot.ruleY([0], {x1: -5000, x2: 5000, y:70, strokeWidth:2}), Plot.ruleY([0], {x1: -5000, x2: 5000, y:60, strokeWidth:2, stroke: color[0]}), Plot.ruleY([0], {x1: -5000, x2: 5000, y:50, strokeWidth:2}), Plot.ruleY([0], {x1: -5000, x2: 5000, y:40, strokeWidth:2, stroke: color[0]}), Plot.ruleY([0], {x1: -5000, x2: 5000, y:30, strokeWidth:2}), Plot.ruleY([0], {x1: -5000, x2: 5000, y:20, strokeWidth:2, stroke: color[0]}), Plot.ruleY([0], {x1: -5000, x2: 5000, y:10, strokeWidth:2}), Plot.ruleY([0], {x1: -5000, x2: 5000, y:0, strokeWidth:2, stroke: color[0]}) ] })32:[{"id":"743edf54c5371daf1beb1d1aa929e4a2f588f94867539494a6f7d3ff9622dde3477b4c0adf2c0eb622ac84755db1f46e2dfda760cd4ab943cceaa2f5f0a5fb79","href":"https://static.observableusercontent.com/files/743edf54c5371daf1beb1d1aa929e4a2f588f94867539494a6f7d3ff9622dde3477b4c0adf2c0eb622ac84755db1f46e2dfda760cd4ab943cceaa2f5f0a5fb79","name":"2.svg","type":"image/svg+xml","lastModified":1741681167816.035,"size":651},{"id":"b9dc0e18aa93004275a48816f880180ae106bc52dd537c92c77eaa76570187a322526ef914d5b111466d9e15592ae9a9f5b5974dbf9d3ef19382c5d469bd0c73","href":"https://static.observableusercontent.com/files/b9dc0e18aa93004275a48816f880180ae106bc52dd537c92c77eaa76570187a322526ef914d5b111466d9e15592ae9a9f5b5974dbf9d3ef19382c5d469bd0c73","name":"ages@12.csv","type":"text/csv","lastModified":1741679050449.844,"size":4410},{"id":"68f1f3178a00a6adeb08646b571ff926dde9df997d869eb80f5ceab9aba5b07770dd8b9dbfa80bdbdb45580f8967fbc0fcb9bb92310703da07a14bc55a46a059","href":"https://static.observableusercontent.com/files/68f1f3178a00a6adeb08646b571ff926dde9df997d869eb80f5ceab9aba5b07770dd8b9dbfa80bdbdb45580f8967fbc0fcb9bb92310703da07a14bc55a46a059","name":"circle-info.svg","type":"image/svg+xml","lastModified":1741679380147.245,"size":555},{"id":"9682709aeeb04e4eef77d7788682a69fde299e3c1ee2bbf690a6e3a795f0df751b0ac38578855d7bb4b88195358de582c664e2dda5302ed170ade0e75979aedb","href":"https://static.observableusercontent.com/files/9682709aeeb04e4eef77d7788682a69fde299e3c1ee2bbf690a6e3a795f0df751b0ac38578855d7bb4b88195358de582c664e2dda5302ed170ade0e75979aedb","name":"circle-question.svg","type":"image/svg+xml","lastModified":1741680956920.31,"size":776},{"id":"f8617e25d3483f64d276b9bb03a8fd33103704287c3dd4862ca405990a71859e229d2bcacd8b73c0c54b2ce7c77215c5011e51980182862be054e52a6c4f55fb","href":"https://static.observableusercontent.com/files/f8617e25d3483f64d276b9bb03a8fd33103704287c3dd4862ca405990a71859e229d2bcacd8b73c0c54b2ce7c77215c5011e51980182862be054e52a6c4f55fb","name":"4.svg","type":"image/svg+xml","lastModified":1741681234153.608,"size":558},{"id":"232e06e4f0c7ece881546cdd00782022ac133f5d1dd02a36143d92a1947baca3cafd824522e06567b501e45e3bb0f5a1b960469e4666e95e124288adbf29455a","href":"https://static.observableusercontent.com/files/232e06e4f0c7ece881546cdd00782022ac133f5d1dd02a36143d92a1947baca3cafd824522e06567b501e45e3bb0f5a1b960469e4666e95e124288adbf29455a","name":"5.svg","type":"image/svg+xml","lastModified":1741681256906.011,"size":661},{"id":"3c58b6f03332b7ada9ff244d09c9b94855582eb53819b9651af879ff326d6cd86faf41a9ea7e305fdadca4f8bd7754e2e3f854267013b9effa95d5ca286d93ab","href":"https://static.observableusercontent.com/files/3c58b6f03332b7ada9ff244d09c9b94855582eb53819b9651af879ff326d6cd86faf41a9ea7e305fdadca4f8bd7754e2e3f854267013b9effa95d5ca286d93ab","name":"3.svg","type":"image/svg+xml","lastModified":1741681208579.967,"size":678},{"id":"c93fb7dd2d85796c087e642e15bfa0937c8081e03d7b06ba1a3f2a4a9ab284b3118481f4cd3118436a28b6c7d9bab69045ef96a4842ebf0083ff0a085b359d87","href":"https://static.observableusercontent.com/files/c93fb7dd2d85796c087e642e15bfa0937c8081e03d7b06ba1a3f2a4a9ab284b3118481f4cd3118436a28b6c7d9bab69045ef96a4842ebf0083ff0a085b359d87","name":"1.svg","type":"image/svg+xml","lastModified":1741681135588.557,"size":510},{"id":"64bba7f3fd7790f2f1b3dcf3753ab5404e3f036754f6d7a15b51994db6abbd5d416b71579be363f5ac808160049e9b4b704b4ac3136041695dfcbd4af6abc570","href":"https://static.observableusercontent.com/files/64bba7f3fd7790f2f1b3dcf3753ab5404e3f036754f6d7a15b51994db6abbd5d416b71579be363f5ac808160049e9b4b704b4ac3136041695dfcbd4af6abc570","name":"n631_4@2.csv","type":"text/csv","lastModified":1741697742694.812,"size":2991},{"id":"d123a698060d33871de6d40161e1bfe3f73b464878fd9c71b954a7fb74e7fbff19561c95be927a124ccaa87e7483bc701c7f3646e6dab4a313b61f1fdb9ae15c","href":"https://static.observableusercontent.com/files/d123a698060d33871de6d40161e1bfe3f73b464878fd9c71b954a7fb74e7fbff19561c95be927a124ccaa87e7483bc701c7f3646e6dab4a313b61f1fdb9ae15c","name":"image.png","type":"image/png","lastModified":1757066935249.314,"size":6939},{"id":"d123a698060d33871de6d40161e1bfe3f73b464878fd9c71b954a7fb74e7fbff19561c95be927a124ccaa87e7483bc701c7f3646e6dab4a313b61f1fdb9ae15c","href":"https://static.observableusercontent.com/files/d123a698060d33871de6d40161e1bfe3f73b464878fd9c71b954a7fb74e7fbff19561c95be927a124ccaa87e7483bc701c7f3646e6dab4a313b61f1fdb9ae15c","name":"image@1.png","type":"image/png","lastModified":1757066953000.287,"size":6939}] 2d:{"title":"Pyramide des âges interactive(Source: Population & Société 631)","cells":[{"id":0,"value":"# Pyramide des âges interactive(Source: Population & Société 631)\n\n","pinned":false,"hidden":false,"mode":"md"},{"id":1297,"value":"data = FileAttachment(\"n631_4@2.csv\").csv({typed:true})","pinned":true,"hidden":false,"mode":"ojs"},{"id":1328,"value":"df = data.map(d=> ({\n age: d.age,\n annee: d.annee,\n anneeLab: d.annee.toString(),\n hommes: d.hommes,\n femmes: d.femmes,\n comment: d.comment,\n yc: d.yc,\n xc: d.xc,\n \n}))","pinned":false,"hidden":false,"mode":"ojs"},{"id":5,"value":"df2 = FileAttachment(\"ages@12.csv\").csv({ typed: true })","pinned":false,"hidden":false,"mode":"ojs"},{"id":960,"value":"color = [\n \"#ff564e\", //rouge\n \"#ff7aad\", //rose\n \"#522673\", //mauve\n \"#0042eb\", //bleu\n \"#5cd49e\", //vert\n \"#ffb322\", //jaune\n \"#4f4f4f\", //gray\n \"#8a8a8a\",//gray light\n \"#0036bc\", // blue dark\n]","pinned":false,"hidden":false,"mode":"ojs"},{"id":1432,"value":"size = width","pinned":true,"hidden":false,"mode":"ojs"},{"id":1427,"value":"\n height = \n { let n;\n if (size>=850) {return n=800}\n else if (size>=500 && size<850) {return n=500}\n else if (size>=400 && size<500) {return n=350} \n else if (size>=350 && size<400) {return n=300}\n else {return n=280}\n }\n","pinned":true,"hidden":false,"mode":"ojs"},{"id":1688,"value":"height2 = {\nlet n; \n if (size>=480) {return n =0.7*size}\n else {return n = 350} \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1449,"value":" dX = \n {\n let n;\n if (size>=350) {return n=27}\n else {return n=10}\n }","pinned":true,"hidden":false,"mode":"ojs"},{"id":1451,"value":"dY =\n {\n let n;\n if (size>=350) {return n=0}\n else {return n=1}\n }","pinned":true,"hidden":false,"mode":"ojs"},{"id":1467,"value":" radius =\n { let n;\n if (size>=1000) {return n=16}\n if (size>=870 && size<1000) {return n=12} \n if (size>=510 && size<870) {return n=7}\n if (size>=370 && size<510) {return n=5}\n else {return n=4.5}\n }","pinned":true,"hidden":false,"mode":"ojs"},{"id":1488,"value":" tick = \n {\n let n;\n if (size>=360) {return n=24}\n else {return n=30}\n }","pinned":true,"hidden":false,"mode":"ojs"},{"id":1653,"value":"popSize = {\n let n; \n if (size>=400) {return n= 15}\n else{return n = 12}\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1660,"value":"labSize = {\n let n; \n if (size>=500) {return n= 18}\n if (size>=400) {return n= 15} \n else{return n = 12}\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1714,"value":"mBottom = {\n let n; \n if (size>400) {return n=70}\n else {return n=40}\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":910,"value":"title4 = html`Population de la France - Évaluation provisoire au 1er janvier 2025 [Et rendu du graph encore très provisoire]`","pinned":false,"hidden":false,"mode":"ojs"},{"id":28,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs"},{"id":1676,"value":"pyramide = htl.html `\n\n

\n${plot4}\n\n

\n\n\n\n`","pinned":true,"hidden":false,"mode":"ojs"},{"id":1113,"value":"info = FileAttachment(\"circle-info.svg\").url()","pinned":false,"hidden":false,"mode":"ojs"},{"id":1532,"value":"r = 11","pinned":true,"hidden":false,"mode":"ojs"},{"id":1366,"value":"

\nGilles Pison, Laurent Toulemon, Population & Sociétés, n° 631, mars 2025, Ined.
\nChamp : France entière.
\nSource : Insee, estimations de population.\n

","pinned":false,"hidden":false,"mode":"html"},{"id":578,"value":"$30","pinned":false,"hidden":false,"mode":"html"},{"id":1753,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}