Public
Edited
Oct 19, 2022
mapchoro = vl.markGeoshape({stroke: '#888', strokeWidth: 0.25})
.data(bairros.features)
.transform(
vl.lookup('properties.NOME')
.from(vl.data(homicides)
.key('Bairro')
.fields('Bairro', 'Homicidios')),
vl.lookup('properties.NOME')
.from(vl.data(homicides_fortal)
.key('Bairro')
.fields('Populacao')),
vl.calculate('(datum.Homicidios/datum.Populacao)*100000').as('taxa_h')
)
.encode(
vl.color().fieldQ('taxa_h').scale({domain: [0, 200], type: 'quantize', clamp: true, scheme: {name: 'oranges', count: 8}}).legend({title: "Homicídios por 100 mil habitantes"}),
vl.tooltip(['Bairro','Populacao','Homicidios',{field: "taxa_h", title: "Homicídios por 100 mil habitantes", format: ".0f"}])
)
.project(vl.projection('mercator'))
.width(850).height(500)
.render()
homicides_fortal = d3.csv("https://gist.githubusercontent.com/emanueles/f573f50bbc3376cae35c0ea1fc1c5509/raw/7aa5c77edd48978315956430a12bb048dab2757b/fortaleza_crimes_homicidios.csv", d3.autoType)
homicides = d3.csv("https://gist.githubusercontent.com/emanueles/bae10fc42b13886b5a00b79737f2b50d/raw/ffb35abe6d9ba0c4ce4866b827f1916748ab65ef/homicidios_2012.csv", d3.autoType)
bairros = d3.json("https://gist.githubusercontent.com/emanueles/f43681762385f250d533eabb35da6dac/raw/4d4541e92fb9ce69e692a7a3c291a4a538ae6b6a/FortalezaBairros.geojson")
Inputs.table(homicides, {columns: ['Bairro','Homicidios']})
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
