We are a research group at the CMU HCII. Our mission is to empower people to analyze and communicate data with interactive systems.
Public
Edited
May 28, 2023
4 stars
duckDBClient = DuckDBClient.of({
flights: FileAttachment("flights-10m.parquet")
})
{
// FALCON
const flightsDuckDB = new falconVis.DuckDB(duckDBClient._db, "flights");
const falcon = new falconVis.FalconVis(flightsDuckDB);
// VIEWS
const count = await falcon.view0D((updatedCounts) => {
mutable selected = updatedCounts.filter;
});
// const resolution = chartWidth; // if the resolution is the same as the chartWidth pixels, filtering will be accurate, if lower, filtering counts will be approximate
const resolution = 350; // I can afford to be approximate here to reduce memory
const distanceView = await falcon.view1D(
{
type: "continuous",
name: "Distance",
bins: 25,
resolution
},
(updatedCounts) =>
updateVegaliteChart(distanceChart, vegaliteDataFormat(updatedCounts))
);
const arrivalDelayView = await falcon.view1D(
{
type: "continuous",
name: "ArrDelay",
range: [-20, 140],
bins: 25,
resolution
},
(updatedCounts) =>
updateVegaliteChart(arrivalDelayChart, vegaliteDataFormat(updatedCounts))
);
const flightDateView = await falcon.view1D(
{
type: "continuous",
name: "FlightDate",
bins: 25,
time: true,
resolution
},
(updatedCounts) =>
updateVegaliteChart(flightDateChart, vegaliteDataFormat(updatedCounts))
);
// LINK'em!
await falcon.link();
addListenersToChart(distanceChart, distanceView);
addListenersToChart(arrivalDelayChart, arrivalDelayView);
addListenersToChart(flightDateChart, flightDateView);
}
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.
