26:null 27:["$","title",null,{"children":"D3 com Crossfilter e DC.js e Leaflet | Sayonara | Observable"}] 2c:T416,function container() { return `

Earthquakes in New Zealand

Number of Events by Magnitude

Events by Depth (km)

Events per hour

DTG	Magnitude	Depth	Latitude	Longitude

Earthquake data via Geonet.

` }2d:T1454,html`Esta célula inclui o css do dc. `2e:T52c,buildvis = { let view = md`${container()}` let dataTable = dc.dataTable(view.querySelector("#dc-table-graph")) dataTable.width(960) .height(800) .dimension(dateDimension) .size(10) .columns(['dtg', 'magnitude', 'depth', 'latitude', 'longitude']) .sortBy(d => d.dtg) .order(d3.ascending) let barChart = dc.barChart(view.querySelector("#magnitude-chart")) barChart.width(480) .height(150) .dimension(magnitudeDimension) .x(d3.scaleLinear().domain([0, 8])) .gap(56) .elasticY(true) .group(magnitudeGroupe) let barChart2 = dc.barChart(view.querySelector("#depth-chart")) barChart2.width(480) .height(150) .dimension(depthDimension) .x(d3.scaleLinear().domain([0, 100])) .gap(1) .elasticY(true) .group(depthGroupe) let lineChart = dc.lineChart(view.querySelector("#time-chart")) lineChart.width(960) .height(150) .dimension(hourDimension) .x(d3.scaleTime().domain(d3.extent(dataset, d => d.dtg))) .margins({top: 50, right: 50, bottom: 25, left: 40}) // .gap(1) // .elasticY(true) .group(hourGroupe) dc.renderAll() return view }2f:[] 2a:{"id":"e5f515c032d85866","slug":"d3-com-crossfilter-e-dc-js-e-leaflet/3","title":"D3 com Crossfilter e DC.js e Leaflet","thumbnail":"6ae5b8bafe231c07e6550a1a34c6b095b530d62b15f70ee0a5bb106aaf7d30cb","access_level":"public","create_time":"$D2019-09-30T22:33:57.599Z","update_time":"$D2019-10-06T19:56:51.430Z","view_time":null,"first_public_time":"$D2019-09-30T22:45:55.358Z","fork":{"id":"b7c593dfd181fa40","slug":"d3-com-crossfilter-e-dc-js-parte-2","title":"D3 com Crossfilter e DC.js (Parte 2)","owner":{"id":"7a6fe25356936255","login":"sayonarasantos","name":"Sayonara"}},"stars":0,"starred":false,"owner":{"type":"team","id":"7a6fe25356936255","login":"sayonarasantos","name":"Sayonara","avatar_url":"https://avatars-next.observableusercontent.com/367401073cb167749ab94d9bf5d368c0a410ff82395caa77baae0a4138ba2040","tier":"starter_2024"},"version":216,"publish_version":216,"role":null,"authored":false,"authors":[{"type":"individual","id":"92bfbc482195215b","login":"sayonarasantos","name":"Sayonara","avatar_url":"https://avatars-next.observableusercontent.com/367401073cb167749ab94d9bf5d368c0a410ff82395caa77baae0a4138ba2040","tier":null}],"members":[{"type":"individual","id":"92bfbc482195215b","login":"sayonarasantos","name":"Sayonara","avatar_url":"https://avatars-next.observableusercontent.com/367401073cb167749ab94d9bf5d368c0a410ff82395caa77baae0a4138ba2040","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"D3 com Crossfilter e DC.js e Leaflet","cells":[{"id":0,"value":"md`# D3 com Crossfilter e DC.js e Leaflet`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"html`css \n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":121,"value":"dataset = d3.csv(\"https://gist.githubusercontent.com/emanueles/65a308ffa630689c11a031252998ef8d/raw/a004c770786229d54264406118ae21ba7e4c51a8/earthquakes.csv\").then(function(data){\n // formatando nossos dados\n let parseDate = d3.utcParse(\"%Y-%m-%dT%H:%M:%S\")\n let formatMagnitude = d3.format(\".1f\")\n let formatDepth = d3.format(\"d\")\n \n data.forEach(function(d,i){\n d.dtg = parseDate(d.origintime.substr(0,19))\n d.magnitude = +formatMagnitude(d.magnitude)\n d.depth = +formatDepth(d.depth)\n d.longitude = +d.longitude\n d.latitude = +d.latitude\n d.usedphasecount = +d.usedphasecount\n d.usedstationcount = +d.usedstationcount\n d.magnitudestationcount = +d.magnitudestationcount\n d.minimumdistance = +d.minimumdistance\n d.azimuthalgap = +d.azimuthalgap\n d.originerror = +d.originerror\n d.magnitudeuncertainty = +d.magnitudeuncertainty\n })\n return data\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"$2c","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"$2d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"dc = require('dc')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"crossfilter = require('crossfilter2')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"d3 = require('d3')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":88,"value":"$$ = require('jquery').then(jquery => {\n window.jquery = jquery;\n return require('popper@1.0.1/index.js').catch(() => jquery);\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":91,"value":"bootstrap = require('bootstrap')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":156,"value":"facts = crossfilter(dataset) ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":158,"value":"dateDimension = facts.dimension(d => d.dtg)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":160,"value":"tableGroup = dateDimension.group(d => \"List of all earthquakes corresponding to the filters\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":162,"value":"magnitudeDimension = facts.dimension(d => d.magnitude)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":164,"value":"magnitudeGroupe = magnitudeDimension.group() //magnitudeGroupe.all()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":166,"value":"depthDimension = facts.dimension(d => d.depth)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":168,"value":"depthGroupe = depthDimension.group()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":170,"value":"hourDimension = facts.dimension(d => d3.timeHour(d.dtg))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":172,"value":"hourGroupe = hourDimension.group()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":189,"value":"L = require('leaflet@1.5.1')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":196,"value":"circlesLayer = L.layerGroup().addTo(map)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":174,"value":"$2e","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":185,"value":"map = {\nbuildvis;\nlet mapInstance = L.map('mapid').setView([-41.05,172.93], 5)\nL.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {\nattribution: '© OpenStreetMapcontributors',\nmaxZoom: 17\n}).addTo(mapInstance)\nreturn mapInstance\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"circles = {\n circlesLayer.clearLayers()\n dataset.forEach( function(d) {\n let circle = L.circle([d.latitude, d.longitude], 10000, {\n color: '#fd8d3c',\n weight: 2,\n fillColor: '#fecc5c',\n fillOpacity: 0.5\n })\n\n circlesLayer.addLayer(circle)\n circle.bindPopup(\"Magnitude: \"+d.magnitude+\"
Time: \"+d.dtg)\n })\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W2f","stdlib":"1","titling":"auto"}} 2b:"$2a:body"