31:[{"id":"92ab5b731657be7d18d2621d5d2027b625fb733693e367d80b3656efdf6da6d32903a71f928d25ddb4b06edb07b4dd6e6eb7a8a72fe68215a49f1654c35957d0","href":"https://static.observableusercontent.com/files/92ab5b731657be7d18d2621d5d2027b625fb733693e367d80b3656efdf6da6d32903a71f928d25ddb4b06edb07b4dd6e6eb7a8a72fe68215a49f1654c35957d0","name":"Screen Shot 2020-05-21 at 9.30.46 AM.png","type":"image/png","lastModified":1590064456419.073,"size":738658}] 2f:{"title":"Visualização de Crimes em Chicago","cells":[{"id":37,"value":"md`# Visualização de Crimes em Chicago\n\n**Usando D3 com Crossfilter, DC.js e Leaflet.**\n\nO arquivo disponível nesse [link](https://gist.githubusercontent.com/emanueles/108e0bd5993d5b9ddcddad49387cb2ea/raw/90de2bbea703504c94179fd63140e50e888ed862/chicago_crimes_april_2020.csv) possui os crimes (HOMICIDE, BURGLARY e ROBBERY) que ocorreram em [Chicago](https://data.cityofchicago.org/Public-Safety/Crimes-2020/qzdf-xmn8) durante o mês de Abril de 2020.\n\nFaça um fork desse notebook e visualize os crimes no mapa. Use uma cor diferente para cada tipo de crime.\n\nCrie um gráfico de barras para mostrar os totais de crimes para cada tipo de crime e um gráfico de linhas (uma linha para cada tipo de crime) mostrando crimes por dia, usando o [dc.seriesChart](https://dc-js.github.io/dc.js/docs/html/dc.seriesChart.html). Veja esse [exemplo](http://dc-js.github.io/dc.js/examples/series.html) como base e as dicas mais abaixo neste notebook.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":42,"value":"// sua função que desenha a visualização deve ficar aqui","pinned":true,"hidden":false,"mode":"ojs"},{"id":0,"value":"md`\n**Dicas**:\n\n** Bar chart com scala de cores**\n\nPara criar uma escala de cores:\n\n\\`\\`\\`javascript\n\n colorScale = d3.scaleOrdinal()\n .domain([\"HOMICIDE\", \"ROBBERY\", \"BURGLARY\"])\n .range([\"#ca0020\", \"#0571b0\", \"#fdae61\"])\n\n\n\\`\\`\\`\n\nPara criar um bar chart com cores diferentes, use os métodos .colors() e .colorAccessor():\n\n\\`\\`\\`javascript\n barChart.colors(colorScale)\n .colorAccessor(d => d.key)\n\\`\\`\\`\n\n** Mapa em escala de cinza**\n\nPara usar um mapa em escala de cinza, use a url: \n\n\\`\\`\\`\n https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png\n\\`\\`\\`\n\nCom a seguinte attribution:\n\n\\`\\`\\`javascript\n \"Map tiles by Carto, under CC BY 3.0. Data by OpenStreetMap, under ODbL.\"\n\n\\`\\`\\`\n\n**Lembre-se de publicar o seu notebook ao concluir a visualização.**\n\nAbaixo está um exemplo da Visualização final.\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":50,"value":"html`

${Object.assign(await FileAttachment(\"Screen Shot 2020-05-21 at 9.30.46 AM.png\").image(), { alt: 'Exemplo de Visualização de Crimes em Chicago', style: 'width: 100%; max-width: 800px;' })}`\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":68,"value":"function container() {\n return `\n

Crimes in Chicago in April of 2020

Number of Crimes by Type

\n \n

Number of Crimes by Day

Crime data via Chicago Data Portal.

\n `;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":4,"value":"html`css \n\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":62,"value":"L = require(\"leaflet@1.6.0\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":58,"value":"d3 = require('d3')","pinned":true,"hidden":false,"mode":"ojs"},{"id":60,"value":"crossfilter = require('crossfilter2')","pinned":true,"hidden":false,"mode":"ojs"},{"id":64,"value":"dc = require('dc')","pinned":true,"hidden":false,"mode":"ojs"},{"id":27,"value":"$$ = require('jquery').then(jquery => {\n window.jquery = jquery;\n return require('popper@1.0.1/index.js').catch(() => jquery);\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":30,"value":"bootstrap = require('bootstrap')","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}