Public
Edited
Jun 2
mapchoro = vl.markGeoshape({stroke: '#888', strokeWidth: 0.25})
.data(vl.topojson(bairros).feature('POLIGONAIS'))
.transform(
// Adicionando o campo calculo no
vl.lookup('properties.Name').
from(
vl.data(
// Realizando o cálculo para determinar a quantidade de habitantes por 100.000 habitantes
homicides.map(d => ({
...d,
Taxa: d['População'] > 0 ? +((d['Número de Homicidios'] / d['População']) * 100000).toFixed(1): 0
})) )
.key('Bairro')
// Adicionando todas as nossas informações
.fields('Bairro', 'Número de Homicidios', 'População', 'Taxa'))
)
.encode(
// Colorindo o mapa de acordo com a taxa por 100000 habintes
vl.color()
.fieldQ('Taxa')
// Obs.: Alterei o domínio e adicionei mais uma 'cor', para diferenciar mais as taxas diferentes
// Também alterei a cor porque azul é uma cor muito apagada
.scale({domain: [0, 350], type: 'quantize', clamp: true, scheme: {name: 'blues', count: 7}}),
// Alterando o tooltip para mostrar a quantidade de homicídios por 100k de habitantes
vl.tooltip(
[
'Bairro',
// Por essa taxa não ser própria do dataset
{ field: 'Taxa', type: 'quantitative', format: '.1f', title: 'Taxa por 100 mil habitantes' }
])
)
// Definindo a projeção e as dimensões da visualização
.project(vl.projection('mercator'))
.width(850)
.height(500)
// Renderizando o mapa
.render()
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.
