2d:null 2e:["$","title",null,{"children":"D3 com Crossfilter, DC.js e Leaflet | LailsonAzevedo | Observable"}] 33:T51e,dataset = d3.csv("https://gist.githubusercontent.com/emanueles/65a308ffa630689c11a031252998ef8d/raw/a004c770786229d54264406118ae21ba7e4c51a8/earthquakes.csv").then(function(data){ // formatando nossos dados let parserUTC = d3.utcParse("%Y-%m-%dT%H:%M:%S") let parserFloat = d3.format(".1f") let parserInt = d3.format("d") data.forEach(function(d,i){ d.publicid = d.publicid d.eventtype = d.eventtype d.origintime = d.origintime d.dtg = parserUTC(d.origintime.substr(0,19)) d.modificationtime = d.modificationtime d.longitude = +d.longitude d.latitude = +d.latitude d.magnitude = +parserFloat(d.magnitude) d.depth = +parserInt(d.depth) d.magnitudetype = d.magnitudetype d.depthtype = d.depthtype d.evaluationmethod = d.evaluationmethod d.evaluationstatus = d.evaluationstatus d.evaluationmode = d.evaluationmode d.earthmodel = d.earthmodel d.usedphasecount = +d.usedphasecount d.usedstationcount = +d.usedstationcount d.magnitudestationcount = +d.magnitudestationcount d.minimumdistance = +d.minimumdistance d.azimuthalgap = +d.azimuthalgap d.originerror = +d.originerror d.magnitudeuncertainty = +d.magnitudeuncertainty }) return data })34:T5c7,buildvis = { let view = md`${container()}` let tabela = dc.dataTable(view.querySelector("#dc-table-graph")) tabela.width(960) .height(800) .dimension(dateDimension) .group(d => "LIst of all earthquakes corresponding to the filters") .size(10) .columns(['dtg','magnitude','depth','latitude','longitude']) .sortBy(d => d.dtg) .order(d3.ascending) // tabela.render() let mag_chart = dc.barChart(view.querySelector("#magnitude-chart")) mag_chart.width(480) .height(150) .x(d3.scaleLinear().domain([0,8])) .gap(56) .elasticY(true) .dimension(magnetudeDimension) .group(totalTerremotoByMag) // mag_chart.render() let depth_chart = dc.barChart(view.querySelector("#depth-chart")) depth_chart.width(480) .height(150) .x(d3.scaleLinear().domain([0,100])) .gap(1) .elasticY(true) .dimension(depthDimension) .group(totalTerremotoByDepth) // depth_chart.render() let time_chart = dc.lineChart(view.querySelector("#time-chart")) time_chart.width(960) .height(150) .x(d3.scaleTime().domain(d3.extent(dataset,d => d.dtg))) .margins({top: 30, right: 50, bottom: 25, left: 40}) // .legend(dc.legend().x(680).y(10).itemHeight(13).gap(1)) .dimension(depthDimension) .group(totalTerremotoByHour) // depth_chart.render() dc.renderAll() return view }35:T42c,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.

` }36:T1453,html`Esta célula inclui o css do dc. `37:[] 31:{"id":"6ef0dc1822301f7f","slug":"d3-com-crossfilter-dc-js-e-leaflet","title":"D3 com Crossfilter, DC.js e Leaflet","thumbnail":"5d28471dd9affb7e8b02760a7675965cec0382b28b6c718e3c593a6dfd007632","access_level":"public","create_time":"$D2019-09-30T21:33:20.121Z","update_time":"$D2019-10-06T21:50:13.937Z","view_time":null,"first_public_time":"$D2019-09-30T22:46:20.801Z","fork":{"id":"f9b98000c2f937e1","slug":"d3-com-crossfilter-e-dc-js-parte-2","title":"D3 com Crossfilter e DC.js (Parte 2)","owner":{"id":"36fbc8f6f5c00a43","login":"lailson93","name":"LailsonAzevedo"}},"stars":0,"starred":false,"owner":{"type":"team","id":"36fbc8f6f5c00a43","login":"lailson93","name":"LailsonAzevedo","avatar_url":"https://avatars-next.observableusercontent.com/8397361199475564bd8b8467c8ee423769557a5b87acf0492efafc33c8656c23","tier":"starter_2024"},"version":268,"publish_version":268,"role":null,"authored":false,"authors":[{"type":"individual","id":"394bd7ee6c15f136","login":"lailson93","name":"LailsonAzevedo","avatar_url":"https://avatars-next.observableusercontent.com/8397361199475564bd8b8467c8ee423769557a5b87acf0492efafc33c8656c23","tier":null}],"members":[{"type":"individual","id":"394bd7ee6c15f136","login":"lailson93","name":"LailsonAzevedo","avatar_url":"https://avatars-next.observableusercontent.com/8397361199475564bd8b8467c8ee423769557a5b87acf0492efafc33c8656c23","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, DC.js e Leaflet","cells":[{"id":0,"value":"md`# D3 com Crossfilter, 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":"$33","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":124,"value":"facts = crossfilter(dataset)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":126,"value":"dateDimension= facts.dimension( d => d.dtg)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":148,"value":"magnetudeDimension = facts.dimension(d => d.magnitude)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":152,"value":"totalTerremotoByMag = magnetudeDimension.group()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":154,"value":"totalTerremotoByMag.all()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":187,"value":"depthDimension = facts.dimension(d => d.depth)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":189,"value":"totalTerremotoByDepth = depthDimension.group()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":191,"value":"totalTerremotoByDepth.all()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":195,"value":"timeDimension = facts.dimension(d => d3.timeHour(d.dtg))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":199,"value":"totalTerremotoByHour = timeDimension.group()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":201,"value":"totalTerremotoByHour.all()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":179,"value":"$34","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":259,"value":"map = {\n buildvis;\n let mapInstance = L.map('mapid').setView([-41.05,172.93], 5)\n L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { attribution: '© OpenStreetMapcontributors', maxZoom: 17}).addTo(mapInstance)\n return mapInstance\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":248,"value":"circlesLayer = L.layerGroup().addTo(map)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":250,"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 circlesLayer.addLayer(circle) \n circle.bindPopup(\"Magnitude: \"+d.magnitude+\"
Time: \"+d.dtg)\n })\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"$35","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"$36","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":241,"value":"L = require('leaflet@1.5.1')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W37","stdlib":"1","titling":"auto"}} 32:"$31:body"