Public
Edited
Aug 17, 2022
2 stars
board = await BoardUrl.create(
"https://ijlyttle.github.io/pins-three-ways/pins/"
)
board.pinList()
timeArquero = await board
.pinFetch("time-arrow")
.then((response) => response.arrayBuffer())
.then(aq.fromArrow)
datetime = timeArquero.column("datetime")
datetime.type
// Table -> [{column: String, unit: Number, timezone: String}]
aqTimestampMeta = function (table) {
// https://stackoverflow.com/a/7390612
const toType = function (obj) {
return {}.toString.call(obj).match(/\s([a-zA-Z]+)/)[1];
};
return table
.columnNames()
.map((x) => ({
column: x,
data: table.column(x)
}))
.filter((x) => toType(x.data) == "TimestampVector")
.map((x) => {
x.unit = x.data.type.unit;
x.timezone = x.data.type.timezone;
delete x.data;
return x;
});
}
timeArqueroMeta = aqTimestampMeta(timeArquero)
timestamp = timeArquero.array("datetime")[0]
aq.op.parse_date(timestamp)
toZonedDateTime(timestamp, "America/Denver").toString() // using .toString() only for display
toFakeUTC(timestamp, "America/Denver")
// Number, String -> ZonedDateTime
toZonedDateTime = function (num, tz) {
const date = aq.op.parse_date(num);
return date.toTemporalInstant().toZonedDateTimeISO(tz);
}
// Number, String -> Date
toFakeUTC = function (num, tz) {
const zdt = toZonedDateTime(num, tz);
return new Date(
Date.UTC(
zdt.year,
zdt.month - 1, // 😲 Temporal months start at 1
zdt.day,
zdt.hour,
zdt.minute,
zdt.second,
zdt.millisecond
)
);
}
Inputs.table(aqArrowTime(timeArquero, (x) => x))
Inputs.table(aqArrowTime(timeArquero, aq.op.parse_date))
Inputs.table(aqArrowTime(timeArquero, toZonedDateTime))
Inputs.table(aqArrowTime(timeArquero, toFakeUTC))
// Table, (Number, String -> *) -> Table
aqArrowTime = function (table, fn) {
const meta = aqTimestampMeta(table);
// operate on the columns named in meta
return meta.reduce(
(tbl, obj) =>
tbl.params(obj).derive({
[obj.column]: aq.escape((d, $) => fn(d[$.column], $.timezone))
}),
table
);
}
import { BoardUrl } from "@ijlyttle/using-pins-with-javascript";
arrow = require("apache-arrow@9.0.0/Arrow.es2015.min.js")
import { aq } from "@uwdata/arquero"
// Load the Temporal API using a Polyfill
// https://observablehq.com/@observablehq/discovering-date-patterns#Temporal
Temporal = {
const TemporalLib = await require("@js-temporal/polyfill@0.4.2");
return TemporalLib.Temporal;
}
toTemporalInstant = {
const TemporalLib = await require("@js-temporal/polyfill@0.4.2");
return TemporalLib.toTemporalInstant;
}
(Date.prototype.toTemporalInstant = toTemporalInstant)
<style> [role="mark"] { background: #EEEEEE; } </style>
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.
