31:T1428,html`Esta célula inclui o css do dc. `32:[] 2f:{"title":"D3 com Crossfilter e DC.js","cells":[{"id":0,"value":"md`# D3 com Crossfilter e DC.js`","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"dataset = d3.csv(\"https://gist.githubusercontent.com/emanueles/d8df8d875edda71aa2e2365fae2ce225/raw/1e949d3da02ed6caa21fe3a7a12a4e5a611a4bab/stocks.csv\").then(function(data){\n // formatando nossos dados\n let parseDate = d3.timeParse(\"%Y/%m/%d\")\n data.forEach(function(d,i){\n d.date = parseDate(d.date)\n d.google = +d.google\n d.facebook = +d.facebook\n })\n return data\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":24,"value":"facts = crossfilter(dataset)","pinned":true,"hidden":false,"mode":"ojs"},{"id":13,"value":"dateDim = facts.dimension( d => d.date)","pinned":true,"hidden":false,"mode":"ojs"},{"id":28,"value":"googleDim = facts.dimension( d => d.google)","pinned":true,"hidden":false,"mode":"ojs"},{"id":30,"value":"topTenGoogle = googleDim.top(10)","pinned":true,"hidden":false,"mode":"ojs"},{"id":34,"value":"bottomTenGoogle = googleDim.bottom(10)","pinned":true,"hidden":false,"mode":"ojs"},{"id":36,"value":"googleByDayGroup = dateDim.group().reduceSum(d => d.google)","pinned":true,"hidden":false,"mode":"ojs"},{"id":85,"value":"fbByDayGroup = dateDim.group().reduceSum(d => d.facebook)","pinned":true,"hidden":false,"mode":"ojs"},{"id":38,"value":"function container(id, title) { \n return `\n

${title}

`\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":41,"value":"buildvis = {\n let view = md`${container('chart','Valores das ações do Google')}`\n let lineChart = dc.lineChart(view.querySelector(\"#chart\"))\n let xScale = d3.scaleTime()\n .domain([dateDim.bottom(1)[0].date, dateDim.top(1)[0].date])\n lineChart.width(800)\n .height(400)\n .dimension(dateDim)\n .margins({top: 30, right: 50, bottom: 25, left: 40})\n .renderArea(false)\n .x(xScale)\n .xUnits(d3.timeDays)\n .renderHorizontalGridLines(true)\n .legend(dc.legend().x(680).y(10).itemHeight(13).gap(5))\n .brushOn(false)\n .group(googleByDayGroup, 'Google')\n dc.renderAll()\n return view \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":92,"value":"buildcomposite = {\n let view = md`${container('chart2', 'Valores das ações do Google e do Facebook')}`\n let compositeChart = dc.compositeChart(view.querySelector(\"#chart2\"))\n let xScale = d3.scaleTime()\n .domain([dateDim.bottom(1)[0].date, dateDim.top(1)[0].date])\n compositeChart.width(800)\n .height(400)\n .margins({top: 50, right: 50, bottom: 25, left: 40})\n .dimension(dateDim)\n .x(xScale)\n .xUnits(d3.timeDays)\n .renderHorizontalGridLines(true)\n .legend(dc.legend().x(700).y(5).itemHeight(13).gap(5))\n .brushOn(false) \n .compose([\n dc.lineChart(compositeChart)\n .group(googleByDayGroup, 'Google')\n .ordinalColors(['steelblue']),\n dc.lineChart(compositeChart)\n .group(fbByDayGroup, 'Facebook')\n .ordinalColors(['darkorange'])])\n dc.renderAll()\n return view \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":72,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":10,"value":"dc = require(\"dc\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":8,"value":"crossfilter = require(\"crossfilter2\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":6,"value":"d3 = require(\"d3\")","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}