Public
Edited
Nov 21, 2023
Fork of Navio Load
1 fork
6 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
viewof maxRowsForParallel = slider({
min: 1,
max: data.length,
value: data.length>1000 ? 1000 : data.length,
step: 1,
description: "How many rows to show in the parallel coordinates chart"
})
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
viewof selectedAttributes = checkbox({
title: "Attributes",
description: "What attributes to use",
options: attributes.map(a => ({value:a, label:a})),
submit: attributes.length>10 ? true :false ,
value: attributes,
form: html`<form id="john"></form>`
})

Insert cell
viewof noneButton = {
const button = html`<button>None</button>`;
d3.select(button)
.on("click", () => {
console.log("click");
d3.select(viewof selectedAttributes).selectAll("input").property("checked", false);
(viewof selectedAttributes).dispatchEvent(new Event('change'));
});
return button;
}
Insert cell
viewof allButton = {
const button = html`<button>All</button>`;
d3.select(button)
.on("click", () => {
console.log("click");
d3.select(viewof selectedAttributes).selectAll("input").property("checked", true);
(viewof selectedAttributes).dispatchEvent(new Event('change'));
});
return button;
}
Insert cell
Insert cell
Insert cell
Insert cell
viewof delimiter = select({
title: "Delimiter",
options:[
",",
";",
{value:"\t", label:"Tab"}],
value:","
})
Insert cell
viewof myFile = html`<input type="file"/ accept="text/csv;text/json">`
Insert cell
Files.text(myFile).then(data => {
try {
mutable data = JSON.parse(data);
} catch (e) {
mutable data = d3.dsvFormat(delimiter).parse(data, d3.autoType);
}
})
Insert cell
viewof save = DOM.download(
new Blob([d3.csvFormat(selected)], {type: "text/csv"}),
"export.csv",
`Export ${selected.length} selected rows`

)
Insert cell
isNumerical = (attr) => typeof(data[0][attr]) === typeof(0)
Insert cell
Insert cell
Insert cell
vegaEmbed = require("vega-embed@4")
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