30:[] 2e:{"title":"Books","cells":[{"id":1,"value":"md`# Books`","pinned":false,"hidden":false,"mode":"ojs"},{"id":19,"value":"viewof booksByRating = {\n const svg = d3.select(DOM.svg(width, height));\n svg.append(\"g\")\n .attr(\"fill\", \"steelblue\")\n .selectAll(\"rect\").data(data).enter().append(\"rect\")\n .attr(\"x\", d => x(d.key))\n .attr(\"y\", d => y(d.values.length))\n .attr(\"height\", d => y(0) - y(d.values.length))\n .attr(\"width\", x.bandwidth());\n \n svg.append(\"g\")\n .call(xAxis);\n \n svg.append(\"g\")\n .call(yAxis);\n \n svg.append(\"g\")\n .call(d3.brushX()\n .extent([[margin.left, margin.top], [width - margin.right, height - margin.bottom]])\n .on(\"start brush end\", brushed));\n \n function brushed() {\n let value = [];\n if (d3.event.selection) {\n // const [[x0, y0], [x1, y1]] = d3.event.selection;\n value = d3.event.selection.map(x.invert);\n // value = data.filter(d => x0 <= x(d[fx]) && x(d[fx]) < x1 && y0 <= y(d[fy]) && y(d[fy]) < y1);\n }\n svg.property(\"value\", value).dispatch(\"input\");\n }\n \n \n return svg.node();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":218,"value":"bel`

\n ${data.map(rating => bel`

Rated ${rating.key}

\n ${rating.values.map(book => bel`

${book.title}

`)}\n

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":152,"value":"books = new Promise(r => d3.csv('https://rawgit.com/tmcw/f077b2f174a0194f62b94bec4e88f4d0/raw/da057dcfe3740134df3f94ab91015b87395056d8/goodreads-export.csv', r))\n .then(books => books.map(book => {\n return {\n author: book.Author,\n title: book.Title,\n yearPublished: book['Year Published'],\n dateAdded: new Date(book['Date Added']),\n rating: parseFloat(book['My Rating']),\n book\n };\n }))","pinned":false,"hidden":false,"mode":"ojs"},{"id":78,"value":"x = d3.scaleBand()\n .domain(d3.range(1, 6))\n .range([margin.left, width - margin.right])\n .padding(0.1)","pinned":false,"hidden":false,"mode":"ojs"},{"id":166,"value":"data = d3.nest()\n \t.key(book => book.rating)\n \t.entries(books)\n .map(({key, values}) => ({key:+key, values}))\n .filter(k => k.key)\n .sort((a, b) => a.key - b.key)","pinned":false,"hidden":false,"mode":"ojs"},{"id":82,"value":"y = d3.scaleLinear()\n .domain([0, d3.max(data, d => d.values.length)]).nice()\n .range([height - margin.bottom, margin.top])","pinned":false,"hidden":false,"mode":"ojs"},{"id":105,"value":"xAxis = g => g\n .attr(\"transform\", `translate(0,${height - margin.bottom})`)\n .call(d3.axisBottom(x))\n .select(\".domain\").remove()","pinned":false,"hidden":false,"mode":"ojs"},{"id":110,"value":"yAxis = g => g\n .attr(\"transform\", `translate(${margin.left},0)`)\n .call(d3.axisLeft(y))\n .append(\"text\")\n .attr(\"fill\", \"#000\")\n .attr(\"x\", 5)\n .attr(\"y\", margin.top)\n .attr(\"dy\", \"0.32em\")\n .attr(\"text-anchor\", \"start\")\n .attr(\"font-weight\", \"bold\")\n .text('count')","pinned":false,"hidden":false,"mode":"ojs"},{"id":69,"value":"height = 500","pinned":false,"hidden":false,"mode":"ojs"},{"id":74,"value":"margin = ({top: 20, right: 30, bottom: 30, left: 40})","pinned":false,"hidden":false,"mode":"ojs"},{"id":6,"value":"d3 = require(\"d3@4\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":225,"value":"bel = require('https://wzrd.in/standalone/bel')","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W30","stdlib":"1","titling":"auto"}