Public
Edited
Mar 14, 2023
http://vis.stanford.edu/wrangler/app/
import {vl} from '@vega/vega-lite-api-v5'
import {fromColumns, printTable} from '@uwdata/data-utilities'
estatisticas_homicidio_regional_2@1.csv
Type Table, then Shift-Enter. Ctrl-space for more options.
{
const bubble = vl.markCircle()
.data(df)
.encode(
vl.x().fieldQ("Longitude").scale({zero: false}),
vl.y().fieldQ("Latitude").scale({zero: false}),
vl.color().fieldN("Regiao"),
vl.size().average("Total Crimes").scale({range: [0, 6000]}).legend(null),
vl.opacity().value(0.7)
)
const lines = vl.markLine()
.data(df)
.encode(
vl.x().fieldN("Mes"),
vl.y().fieldQ("Total Crimes"),
vl.color().fieldN("Regiao"),
vl.opacity().value(0.7)
);
const avgLine = vl.markLine()
.data(df)
.encode(
vl.x().fieldN("Mes"),
vl.y().average("Total Crimes"),
vl.color().value("Black"),
vl.size().value(3)
);
return vl.hconcat(bubble,vl.layer(lines, avgLine)).render()
}
df = estatisticas_homicidio_regional
vl.markBar()
.data(estatisticas_homicidio_regional)
.encode(
vl.x().fieldN("Regiao"),
vl.y().average("Total Crimes"),
vl.color().fieldN("Regiao")
)
.project(vl.projection('identity'))
.render()
sp = "https://raw.githubusercontent.com/tbrugz/geodata-br/master/geojson/geojs-35-mun.json"
{
const regioes = vl.markGeoshape({fill: null, stroke: 'gray', strokeWidth: 0.3})
.data(vl.topojson(sp).mesh('regioes'));
const bubble = vl.markCircle()
.data(df)
.encode(
vl.longitude().fieldQ("Longitude"),
vl.latitude().fieldQ("Latitude"),
vl.color().fieldN("Regiao"),
vl.size().average("AverageCrimes").scale({range: [600, 6000]}).legend(null),
vl.opacity().value(0.8)
)
const lines = vl.markLine()
.data(df)
.encode(
vl.x().fieldN("Mes"),
vl.y().fieldQ("AverageCrimes").title("Média de homicídios anual"),
vl.color().fieldN("Regiao"),
vl.opacity().value(0.8)
);
const avgLine = vl.markLine()
.data(df)
.encode(
vl.x().fieldN("Mes"),
vl.y().average("AverageCrimes"),
vl.color().value("Black"),
vl.size().value(3)
);
return vl.hconcat(vl.layer(regioes, bubble)
.padding(0)
.width(300)
.config({view: {stroke: null}}),
vl.layer(lines,avgLine).title("Média de homicídios em preto"))
.title("Onde e quando é mais perigoso em São Paulo?")
.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.
