3e:null 3f:["$","title",null,{"children":"Rendu TP 4 – Geo map | Sekkari Aamer | Observable"}] 45:T918,{ let chosenDate = datePickerValueParsed raw.features.forEach(d => { Array.from(filterCovidData).forEach(e => { if(d.properties.code == e.dep & e.jour.getDate() == chosenDate.getDate()) d.properties.value = e.hosp }) }) const width = 1000, height = 580; const svg = d3.create("svg") .attr("viewBox", [0, 0, width, height]); var g = svg.append("g"); var projection = d3.geoConicConformal() .center([2.454071, 46.279229]) .scale(2800) const color =d3.scaleLinear() .domain([0, 200]) .range(["white", "green"]) var path = d3.geoPath().projection(projection); // create a tooltip var tooltip = d3.select('body').append('div') .attr('class', 'hidden tooltip'); // this function that change the tooltip when user hover a cell var mouseover = function(d) { tooltip .style("opacity", 1) d3.select(this) .style("stroke", "black") .style("opacity", 1) } g.selectAll("path") .data(raw.features) .join("path") .attr("class","path") .attr("d", path) .attr("fill", d => color(d.properties.value)) .on("mouseover", mouseover) .on('mousemove', function(e, d) { // on recupere la position de la souris, // e est l'object event d var mousePosition = [e.x, e.y]; console.log(mousePosition); // on affiche le toolip tooltip.classed('hidden', false) // on positionne le tooltip en fonction // de la position de la souris .attr('style', 'left:' + (mousePosition[0] + 15) + 'px; top:' + (mousePosition[1] - 35) + 'px') // on recupere le nom de l'etat .text(d.properties.nom + ":" +d.properties.value) }) .on('mouseout', function() { // on cache le toolip tooltip.classed('hidden', true); tooltip .style("opacity", 0) d3.select(this) .style("stroke", "none") .style("opacity", 0.8) }); return svg.node() }46:[{"id":"2f0a03b1432fe972d7c4628597260d26940f8f6982066868f33e5e10199265e5dba19f7dac6f631bbee7f733be4c846a9f0bae337562b42dda30a5711ffbf621","href":"https://static.observableusercontent.com/files/2f0a03b1432fe972d7c4628597260d26940f8f6982066868f33e5e10199265e5dba19f7dac6f631bbee7f733be4c846a9f0bae337562b42dda30a5711ffbf621","name":"covid-06-11-2021 (1).csv","type":"text/csv","lastModified":1675639405317.816,"size":2934101},{"id":"bc6a0b2ac4f30de04ad12b79777a54abb318080277bb9a5b54e7f4b62b9a4f0eeeb19153cce09eda3f148a58300faf34d9a296b0e4cb91dc90b87c4b8c1ebfc9","href":"https://static.observableusercontent.com/files/bc6a0b2ac4f30de04ad12b79777a54abb318080277bb9a5b54e7f4b62b9a4f0eeeb19153cce09eda3f148a58300faf34d9a296b0e4cb91dc90b87c4b8c1ebfc9","name":"departements-version-simplifiee.geojson.txt","type":"text/plain","lastModified":1675639485889.399,"size":569299}] 43:{"id":"972063385fef1e8a","slug":null,"title":" Rendu TP 4 – Geo map","thumbnail":"61ad0636b0b048693b8931e6eb0da290153140c1c5dac1614ed2970e5549ccf8","access_level":"public","create_time":"$D2023-01-31T16:48:44.138Z","update_time":"$D2023-02-06T00:51:30.880Z","view_time":null,"first_public_time":"$D2023-01-31T16:48:44.138Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"7e146cbe0bb08695","login":"amesekkari","name":"Sekkari Aamer","avatar_url":"https://avatars-next.observableusercontent.com/c046906ba1de78c2a8789980ff03f6579da977af81c2a74d667d9c8476b0e882","tier":"starter_2024","bio":"","following":false},"version":73,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"454371bbc9ed37ab","login":"amesekkari","name":"Sekkari Aamer","avatar_url":"https://avatars-next.observableusercontent.com/c046906ba1de78c2a8789980ff03f6579da977af81c2a74d667d9c8476b0e882","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"454371bbc9ed37ab","login":"amesekkari","name":"Sekkari Aamer","avatar_url":"https://avatars-next.observableusercontent.com/c046906ba1de78c2a8789980ff03f6579da977af81c2a74d667d9c8476b0e882","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":" Rendu TP 4 – Geo map","cells":[{"id":0,"value":"

Rendu TP 4 – Geo map

Binôme : SEKKARI Aamer- LHASSANI Youness

","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":49,"value":"

1 Chargement d’un fond de carte

2 Chargement d’un jeu de données

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":11,"value":"rawCovid=FileAttachment(\"covid-06-11-2021 (1).csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"Inputs.table(rawCovid)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"dataCovid=FileAttachment(\"covid-06-11-2021 (1).csv\").csv().then((d)=>{\n\n let parseDate=d3.timeParse(\"%Y-%m-%d\");\n d.forEach(e=>{\n e.jour=parseDate(e.jour)\n })\n return d\n}\n \n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":33,"value":"Inputs.table(dataCovid)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"filterCovidData=dataCovid.filter(d=>d.sexe=\"0\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":55,"value":"

Visualisation statique

Visualisation interactive

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":39,"value":"viewof datePickerValue = Inputs.date({label: \"Date picker\",min: \"2021-06-01\", max: \"2021-11-25\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":41,"value":"datePickerValue","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":43,"value":"datePickerValueParsed = new Date(datePickerValue)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":45,"value":"{\n \n let chosenDate = datePickerValueParsed\n raw.features.forEach(d => {\n Array.from(filterCovidData).forEach(e => {\n \n if(d.properties.code == e.dep & e.jour.getDate() == chosenDate.getDate())\n d.properties.value = e.hosp\n })\n })\n const width = 1000,\n height = 580;\n const svg = d3.create(\"svg\")\n .attr(\"viewBox\", [0, 0, width, height]);\n \n\n var g = svg.append(\"g\");\n var projection = d3.geoConicConformal()\n .center([2.454071, 46.279229])\n .scale(2800)\n const color =d3.scaleLinear()\n .domain([0, 200])\n .range([\"white\", \"green\"])\n var path = d3.geoPath().projection(projection);\n \n g.selectAll(\"path\")\n .data(raw.features)\n .join(\"path\")\n .attr(\"d\", path)\n .attr(\"fill\", d => color(d.properties.value))\n \n\nreturn svg.node()\n\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":72,"value":"