34:null 35:["$","title",null,{"children":"Interactive Prov line chart | quackas | Observable"}] 3b:[{"id":"2e8facc2121abf0c49b1866173fe3ea48711521824f4eb766212209b62ab77d952170554bbe25613b54bafb63637ac72fc7a001594c818155fe6d5720727fa20","href":"https://static.observableusercontent.com/files/2e8facc2121abf0c49b1866173fe3ea48711521824f4eb766212209b62ab77d952170554bbe25613b54bafb63637ac72fc7a001594c818155fe6d5720727fa20","name":"covid19-data@1.csv","type":"text/csv","lastModified":1634002590309.697,"size":1643799}] 39:{"id":"87c1412cd9de8b65","slug":"plot-scatterplot/2","title":"Interactive Prov line chart","thumbnail":"b33147635f3573b3079ae5caef5914edab48d1371660d85c1cf77ddf35a7c8a4","access_level":"public","create_time":"$D2021-10-12T01:21:02.551Z","update_time":"$D2021-10-18T16:51:00.753Z","view_time":null,"first_public_time":"$D2021-10-18T16:03:22.972Z","has_unpublished_edits":null,"fork":{"id":"e48bf34c52588bc9","slug":"plot-scatterplot","title":"Plot Scatterplot","owner":{"id":"f35c755083683fe5","login":"observablehq","name":"Observable"}},"stars":0,"starred":false,"owner":{"type":"team","id":"0521628a0f2998c2","login":"quackas","name":"","avatar_url":"https://avatars-next.observableusercontent.com/dabdc9b9adda77ca353ae654b9ce7e6cfdbe80dae8015a59d9220fe2562f92b7","tier":"starter_2024","bio":""},"version":230,"publish_version":230,"role":null,"authored":false,"authors":[{"type":"individual","id":"3f449a3cee7c85fa","login":"quackas","name":"","avatar_url":"https://avatars-next.observableusercontent.com/dabdc9b9adda77ca353ae654b9ce7e6cfdbe80dae8015a59d9220fe2562f92b7","tier":null,"bio":""}],"members":[{"type":"individual","id":"3f449a3cee7c85fa","login":"quackas","name":"","avatar_url":"https://avatars-next.observableusercontent.com/dabdc9b9adda77ca353ae654b9ce7e6cfdbe80dae8015a59d9220fe2562f92b7","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Interactive Prov line chart","cells":[{"id":0,"value":"# Interactive Prov line chart\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":185,"value":"import { swatches } from \"@d3/color-legend\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":182,"value":"swatches({ color: colorScale })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":171,"value":"viewof watching = Inputs.checkbox(d3.group(cov,x => x.prname), {label: \"Watching\", unique: true})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"chart2 = addLegend(\n Plot.dot(watching.flat(), {\n x: \"date\",\n y: \"numdeaths\",\n stroke: \"prname\",\n title: \"Province\"\n })\n .plot({ grid: true }),\n colorLegend(colorScale)\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":194,"value":"function addLegend (chart, legend) {\n let [lw, cw] = [+legend.getAttribute(\"width\"), +chart.getAttribute(\"width\")];\n let [lh, ch] = [\n +legend.getAttribute(\"height\"),\n +chart.getAttribute(\"height\")\n ];\n return svg``;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":192,"value":"function colorLegend(colorScale, options = {}) {\n let { tickPadding = 5, width = 110, marginRight = 80 } = options;\n return Plot.plot({\n marks: [\n Plot.cellX(colorScale.domain(), {\n y: colorScale.domain(),\n x: 0,\n color: colorScale.range()\n })\n ],\n y: {\n axis: \"right\",\n tickSize: 0,\n tickPadding\n },\n x: {\n axis: null\n },\n width,\n marginRight\n });\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":189,"value":"function addColorLegend(\n chart,\n colorScale,\n options = { sampleSize: 20, lineSpacing: 1.2, margin: 5, x0: 640, y0: 10 }\n) {\n const { sampleSize, lineSpacing, margin, x0, y0 } = options;\n const leg = svg``;\n const domain = colorScale.domain();\n const range = colorScale.range();\n domain.forEach((label, i) => {\n const x = x0;\n const y = y0 + sampleSize * lineSpacing * i;\n const group = svg``;\n leg.append(group);\n group.append(\n svg``\n );\n group.append(\n svg`${label}`\n );\n });\n if (chart.nodeName === \"svg\") chart.append(leg);\n else\n d3.select(chart)\n .select(\"svg\")\n .append(() => leg);\n return chart;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":180,"value":"colorScale = d3.scaleOrdinal(\n [...new Set(data.map((d) => d.prname))],\n d3.schemeTableau10\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":57,"value":"d3.extent(data, d=>d.date)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"html``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":146,"value":"y.domain()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":89,"value":"x = d3.scaleLinear()\n .domain([0,d3.max(data, d=>d.numtotal)])\n .range([margin.left + 20, width - margin.right])\n .interpolate(d3.interpolateRound)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":95,"value":"y = d3.scaleBand()\n .domain(data.map(d =>d.prname))\n .range([margin.top, height - margin.bottom ])\n .padding(0.1)\n .round(true)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":62,"value":"total = data.map(d => d.rateactive)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":65,"value":"import {chart as totalHistogram} with {total as data, height} from \"@d3/histogram\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":67,"value":"totalHistogram","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":50,"value":"cov = d3.csvParse(await FileAttachment(\"covid19-data@1.csv\").text(),d3.autoType)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"data = FileAttachment(\"covid19-data@1.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":77,"value":"height = 400","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":92,"value":"margin = ({top:20, right: 0, bottom:0, left:100})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W3b","stdlib":"1"}} 3a:"$39:body"