Public
Edited
Jun 4
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
mapchoro = vl.markGeoshape({stroke: '#888', strokeWidth: 0.25})
.data(vl.topojson(bairros).feature('POLIGONAIS'))
.transform(
vl.lookup('properties.Name').from(vl.data(homicides).key('Bairro').fields('Bairro', 'Número de Homicidios'))
)
.encode(
vl.color().fieldQ('Número de Homicidios').scale({domain: [0, 70], type: 'quantize', clamp: true, scheme: {name: 'blues', count: 7}}),
vl.tooltip(['Bairro', 'Número de Homicidios'])
)
.project(vl.projection('mercator'))
.width(850).height(500)
.render()
Insert cell
mapchoro2 = vl.markGeoshape({stroke: '#888', strokeWidth: 0.25})
.data(vl.topojson(bairros).feature('POLIGONAIS'))
.transform(
vl.lookup('properties.Name').from(vl.data(homicides).key('Bairro').fields('Bairro', 'Número de Homicidios','Taxa'))
)
.encode(
vl.color().fieldQ('Taxa').scale({domain: [0, 425], type: 'quantize', clamp: true, scheme: {name: 'blues', count: 9}}),
vl.tooltip(['Bairro', 'Número de Homicidios',
{ field: 'Taxa', type: 'quantitative', format: '.1f', title: "Taxa por 100 mil habitantes"}])
)
.project(vl.projection('mercator'))
.width(850).height(500)
.title({text: "Homicídios em fortaleza em 2012", fontSize: 30})
.render()
Insert cell
homicides.forEach(d => {
d.Taxa = d["Número de Homicidios"] * 100000 / d["População"];
});
Insert cell
Insert cell
Insert cell
Insert cell

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.
Learn more