Published
Edited
Feb 28, 2021
1 star
// Select graph mode, if no box is checked then nothing will show up.
viewof modeSelect = Checkbox(["Average", "Daily Flight"])
{
const daily_flight = vl
.markCircle()
.data(flight_collection_dateseparated)
.select(vl.selectInterval().bind('scales'))
.encode(
vl.x().fieldT('Date'),
vl.y().fieldQ('number_of_flight'),
vl.color().fieldN('Year'),
vl.tooltip([
{ field: "Date", type: "Temporal", format: "%B %_d" },
{ field: "number_of_flight", type: "quantitative" },
{ field: "Average_7_day", type: "quantitative" }
])
);
const seven_day_avg = vl
.markLine()
.data(flight_collection_dateseparated)
.select(vl.selectInterval().bind('scales'))
.encode(
vl.x().fieldT('Date'),
vl.y().fieldQ('Average_7_day'),
vl.color().fieldN('Year')
);
if (modeSelect.includes("Average") && modeSelect.includes("Daily Flight")) {
return vl.layer(daily_flight, seven_day_avg).render();
} else if (modeSelect.includes("Average")) {
return vl.layer(seven_day_avg).render();
} else if (modeSelect.includes("Daily Flight")) {
return vl.layer(daily_flight).render();
} else {
return vl.layer().render();
}
}
raw_flight_collection_dateseparated = FileAttachment(
"flight_collection_dateseparated.csv"
).csv()
flight_collection_dateseparated = raw_flight_collection_dateseparated.map(
d => ({
Date: d.month_day,
Year: parseInt(d.Year),
number_of_flight: parseInt(d.number_of_flight),
Average_7_day: parseInt(d.seven_day_moving_average)
})
)
//first 5 item in the table
printTable(flight_collection_dateseparated.slice(0, 5))
//last 5 item in the table, verify if the dataset is consistent (From Jan 1, 2019 to Dec 31, 2020)
printTable(flight_collection_dateseparated.slice(-5))
import { Checkbox } from "@observablehq/inputs"
year = [2019, 2020, "Both"]
d3 = require('d3')
import { printTable } from '@uwdata/data-utilities'
import { vl } from '@vega/vega-lite-api'
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.
