Published
Edited
Sep 16, 2021
1 fork
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
colorScale = {
const { maxEvents } = chartConfig;
return d3.scaleSequentialSqrt(d3.interpolateOrRd).domain([0, maxEvents]);
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
eventTimes = {
return rawData.events
.filter((event) => event.attributes)
.map((event) => event.attributes["(endTime)"])
.map((time) => new Date(time / 10e5));
}
Insert cell
Insert cell
binnedData = {
const scale = d3
.scaleTime()
.domain(d3.extent(eventTimes))
.nice(); // ♥️♥️♥️
const timeRangeMs = scale.domain()[1] - scale.domain()[0];
const binFn = d3
.bin()
.domain(scale.domain())
.thresholds(timeRangeMs / 100);
return binFn(eventTimes);
}
Insert cell
Insert cell
ws = {
console.log(connectBtn);
return connect("ws://localhost:8029/events");
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
rawData = (websocketMessage && websocketMessage.data) || sampleData
Insert cell
Insert cell
import { showStatus, connect } from "@cimi/websocket-utils"
Insert cell
Insert cell
Insert cell
_ = require("lodash")
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