Public
Edited
Jun 27, 2023
Insert cell
Insert cell
Insert cell
async function loadData(url) {
return fetch(
url,
{ Method: "GET" }
)
.then((response) => {
return response.json();
})
.then((data) => {
return data.dados; // ".dados" faz parte da estruturação da API
})
}
Insert cell
data = fetch(url_base).then((response) => response.json())
Insert cell
data1 = data.value
Insert cell
data1
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Plot.plot({
marks: [
Plot.barY(data.value, {x: "DOTACAO_ATUALIZADA", y: "UNIDADE_ORCAMENTARIA", sort: {y: "x", reverse: true}}),
Plot.ruleY([0])
]
})
Insert cell
[... new Set(data.value.map(d=> d.UNIDADE_ORCAMENTARIA))]
Insert cell
Insert cell
unidade
Insert cell
dados_unidade = data.value.filter(d=> (unidade == 'Todas' || d.UNIDADE_ORCAMENTARIA == unidade ))
Insert cell
Insert cell
Insert cell
Insert cell
Treemap(flare, {
path: (d) => d.name.replaceAll(".", "/"), // e.g. flare/animate/Easing
label: (d) => d.name.split(".").pop(), // display text
group: (d) => d.name.split(".")[1], // for color; e.g. animate
value: (d) => d?.size, // area of each rect
title: (d, n) => [n.id, n.value.toLocaleString()].join("\n"), // hover text
width,
height: 500
})
Insert cell
import {Treemap} from "@d3/treemap"
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