2f:T43d,distChart = { const spec = { height: height, y: { grid: true, tickFormat: "~s" }, x: { label: "Distance (mi.) →" }, marks: [ Plot.rectY( data, Plot.binX( { y: "count" }, { x: "distance", filter: (d) => inDomain(delay(d), delayDomain) && inDomain(hour(d), hourDomain) && inDomain(d.date, dateDomain) } ) ), Plot.ruleY([0]) ] }; let chart = Plot.plot(spec); const x = chart.scale("x"), [x1, x2] = x.range; const y = chart.scale("y"), [y1, y2] = y.range; let domain = x.domain; const wrapper = svg`

Distance

${distChart}

Hour of the day

${hourDayChart}

Arrival delay

${delayChart}

Date

${dateChart}

\n\n","pinned":false,"hidden":false,"mode":"html"},{"id":53,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs"},{"id":108,"value":"$30","pinned":true,"hidden":false,"mode":"ojs"},{"id":121,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":26,"value":"$32","pinned":true,"hidden":false,"mode":"ojs"},{"id":31,"value":"## Utils & globals","pinned":false,"hidden":false,"mode":"md"},{"id":363,"value":"height = 140","pinned":true,"hidden":false,"mode":"ojs"},{"id":772,"value":"hourScaleDomain = d3.extent(data, (d) => hour(d))","pinned":true,"hidden":false,"mode":"ojs"},{"id":693,"value":"### Accessors","pinned":false,"hidden":false,"mode":"md"},{"id":248,"value":"delay = function (d) {\n return Math.max(-60, Math.min(149, d.delay));\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":664,"value":"hour = function (d) {\n return d.date.getHours() + d.date.getMinutes() / 60;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":34,"value":"parseDate = function (d) {\n return new Date(\n 2001,\n d.substring(0, 2) - 1,\n d.substring(2, 4),\n d.substring(4, 6),\n d.substring(6, 8)\n );\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":701,"value":"### Predicates","pinned":false,"hidden":false,"mode":"md"},{"id":703,"value":"inDomain = function (d, domain) {\n return domain === null ? true : d >= domain[0] && d <= domain[1];\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":695,"value":"### Brush selection as `mutable`","pinned":false,"hidden":false,"mode":"md"},{"id":680,"value":"mutable distDomain = null","pinned":true,"hidden":false,"mode":"ojs"},{"id":687,"value":"mutable delayDomain = null","pinned":true,"hidden":false,"mode":"ojs"},{"id":689,"value":"mutable hourDomain = null","pinned":true,"hidden":false,"mode":"ojs"},{"id":691,"value":"mutable dateDomain = null","pinned":true,"hidden":false,"mode":"ojs"},{"id":14,"value":"## Data loading","pinned":false,"hidden":false,"mode":"md"},{"id":38,"value":"data = flights.map((d, i) => ({\n ...d,\n date: parseDate(d.date)\n}))","pinned":true,"hidden":false,"mode":"ojs"},{"id":29,"value":"flights.map((d) => parseDate(d.date))","pinned":true,"hidden":false,"mode":"ojs"},{"id":11,"value":"flights = await FileAttachment(\"flights-3m.csv\").csv({typed: \"auto\"})","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}