📷 instagram.com/nestor2509
Public
Edited
Nov 7, 2022
viewof table2 = Inputs.table(data_preparatorio)
chart_ = DonutChart(
data_uni_preparatorios.sort((a, b) => d3.descending(a.value, b.value)),
{
name: (d) => d.key,
value: (d) => d.value,
width,
height: 500,
colors: ["#d3422c", "#edb90d", "#178acb", "#d31b7e"]
}
)
data_ano = {
const resp = [];
data.map((d) => {
let name = d["Año en el que salió del proyecto"];
const i = resp.find(
(r) => r["name"].toLowerCase().trim() === name.toLowerCase().trim()
);
if (i) {
i.value += 1;
} else if (name !== "") {
resp.push({
name: name.trim(),
value: 1
});
}
});
return resp;
}
Plot.plot({
marginLeft: 250,
marginBottom: 50,
width: width,
// Le asigno unos estilos
style: {
// Sangría
padding: 20,
// Color de fondo
backgroundColor: "#fff",
// Color de las letras
color: "#333",
// Tamaño de la letra
fontSize: 12,
// Fuente de la letra
fontFamily: "sans"
},
// Le damos algunas propiedades a nuestro eje Y: un nombre y un orden
y: {
label: "Universidad"
// usamos d3.sort para definir un orden que sea por las ventas globales
// domain: d3
// .sort(top10, (d) => -d[columna_venta_obj[0].columna])
// .map((d) => d["Name"])
},
// Le ponemos un label a nuestro eje X y le añadimos una grilla
x: {
label: "",
grid: true
// Le asignamos un dominio fijo al eje X para que cuando cambiemos de columna la escala se mantenga
// domain: [0, 90]
},
marks: [
Plot.barX(table1, {
x: "value",
y: "instrumento",
sort: { y: "x", reverse: true },
fill: "#edb90d"
}),
Plot.ruleX([0])
]
})
viewof table3 = Inputs.table(data_filter_dos)
data_aggr_centro = {
const resp = [];
data.map((d) => {
let name = d["Estrategia(s) de atención en la(s) cual(es) participó"];
const i = resp.find(
(r) => r["name"].toLowerCase().trim() === name.toLowerCase().trim()
);
if (i) {
i.value += 1;
} else {
resp.push({
name: name.trim(),
value: 1
});
}
});
return resp;
}
chart__ = DonutChart(
data_aggr_centro.sort((a, b) => d3.descending(a.value, b.value)),
{
name: (d) => d.name,
value: (d) => d.value,
width,
height: 500,
colors: ["#d3422c", "#edb90d", "#178acb", "#d31b7e"]
}
)
import { DonutChart } from "f445526371984d00"
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.
