2d:null 2e:["$","title",null,{"children":"Sparks with 'live' data | Tom Pearson | Observable"}] 33:[] 31:{"id":"b70b5ba4b72f80f9","slug":"sparks-with-live-data","title":"Sparks with 'live' data","thumbnail":"590da9ad0e2b3f6645ec5036227fafe10f4909b0f46a6e2d11fb6322d740068c","access_level":"public","create_time":"$D2019-01-23T12:06:28.887Z","update_time":"$D2019-03-28T13:58:09.043Z","view_time":null,"first_public_time":"$D2019-01-23T12:08:28.243Z","has_unpublished_edits":null,"fork":{"id":"24108b98179ea9b1","slug":"after-the-flood-i-sparks-i-typeface","title":"After the Flood _Sparks_ typeface","owner":{"id":"45d8dac961c18abd","login":"tomgp","name":"Tom Pearson"}},"stars":5,"starred":false,"owner":{"type":"team","id":"45d8dac961c18abd","login":"tomgp","name":"Tom Pearson","avatar_url":"https://avatars-next.observableusercontent.com/26cbbccc572a8a25c540387278c92aae1c68384373da7f85ef1cd717c7fbf381","tier":"starter_2024"},"version":252,"publish_version":252,"role":null,"authored":false,"authors":[{"type":"individual","id":"08c8ac6bee0bc7e8","login":"tomgp","name":"Tom Pearson","avatar_url":"https://avatars-next.observableusercontent.com/26cbbccc572a8a25c540387278c92aae1c68384373da7f85ef1cd717c7fbf381","tier":null}],"members":[{"type":"individual","id":"08c8ac6bee0bc7e8","login":"tomgp","name":"Tom Pearson","avatar_url":"https://avatars-next.observableusercontent.com/26cbbccc572a8a25c540387278c92aae1c68384373da7f85ef1cd717c7fbf381","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":3,"collection":{"id":"c0545dea91f81742","slug":"sparks/2","title":"Sparks","owner":{"id":"45d8dac961c18abd","login":"tomgp","name":"Tom Pearson"}},"type":"notebook","body":{"title":"Sparks with 'live' data","cells":[{"id":0,"value":"md`# Sparks with 'live' data\n\nShowing the population of London boroughs between 1801 and 2011`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"html`${ data.map(\n row=>`

${sparkString(row['Area Name'])} ${row['Area Name']}

`)\n}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"html`\n

\n external style sheet (font-face definitions)\n

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"html`\n

CSS classes

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":129,"value":"sparkString = (borough) => {\n return `${boroughPopulation(borough,1801)}{${normalise(boroughPopulation(borough)).join(',')}}${boroughPopulation(borough,2011)}`\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":237,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":111,"value":"boroughPopulation = (borough, year='') => {\n const boroughRow = data.filter(d=>(d['Area Name'] == borough))[0];\n return Object\n .keys(boroughRow)\n .filter(d=>(d.indexOf('Persons-'+year)>-1))\n .map(d=>Number(boroughRow[d]));\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"normalise = function(data){\n const max = d3.max(data);\n return data.map(d=>{\n return Math.floor(d/max * 100);\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":75,"value":"data = d3.csv('https://raw.githubusercontent.com/aftertheflood/londonsquared/master/site/data/census-historic-population-borough.csv')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":73,"value":"d3=require('d3')\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 32:"$31:body"