Published
Edited
Jul 25, 2019
3 stars
Hello, PGLiteINSEE ParquetHello, apcachDruidJS workerHello, OrbitWord Tour: 40k words and their friendsHello, spectral.jsHello, petite-vueHello, @thi.ng/grid-iteratorsHello, thumbhashHello, SwissGLHello, QOI (and glitches)Hello, orbHello, cosmographHello, TabulatorUsing d3.blur with PlotMath.cbrtHello debounceColorcetHello, gliiHello, Open MeteoHello, PyWaveletsHello, typesenseHello, libgifHello, kmeans-engineHappy anniversary, Project Gutenberg!Hello, fflateHello, ArchieML!Hello, d3-bboxCollideHello, jsgeoda!Hello, EDTF!Hello, protovis!Hello, placekeyHello, fuse.jsHello, Reorder.jsHello, shadow DOMjszipHello, procedural-glHello, qhullHello, genetic-jsDruidJSHello, Tippy.jsHello, paintWorkletBig πHello, AutoencoderHello, Shakespearean UUIDsHello, ccwt.jsHello, constrainautorHello, talismanHello, polygon-offsetHello p-queueHello async-poolHello rollup-plugin-asciiHello, algebra.jsHello, pixi.jsHello, d3-renderHello zip/unzipCumulative Wikipedia DonationsHTML <details>regl textureHello, npyjsHello protobufHello, pencil touchHello, LOESSHello html2canvaslegra mapscolor2cssHello, ecsy2D point distributionsHello, delatinThe gpu.js loopDijkstra’s shortest-path treeHello nojacko/Dijkstras-jsHello, tcort/dijkstrajsHello, lambdabaa/dijkstraHello, gpu.js v2Hello jsqrHello qrcodeHello SharedArrayBuffer
Hello GamePad API
Hello vtk.jsHello nd4jsHello BiofabricTravelling with a self-organizing mapHello glitchHello UMAP-jsHello pandemoniumHello iocaneHello JSON-editorHello d3-griddingHello mljs/knnWorkerHello lalolibImage to GPU.jsImage to blink.jsTissot's indicatrixVega projectionsHello WebCLGLUsing d3-inertia with observableVideo contouring 3ngraph: pagerank, louvain…Union-FindPerceptron (simple statistics)mljsHello h3-jsEmoji FlagsHello, poisson-disk-sampling
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
event = {
var current = { dim: -1, value: 0 };

do {
const d = (data[data.length - 1] || []).slice();
const i = d3.scan(d.map(d => -Math.abs(d)));
const v = Math.sign(d[i]) * (Math.abs(d[i]) > 0.3);
if (i !== current.dim || v !== current.value) {
current.dim = i;
current.value = v;
yield current;
} else await Promises.delay(60);
} while (true);
}
Insert cell
Insert cell
color = d3.scaleOrdinal(d3.schemeCategory10)
Insert cell
gamepad = {
yield () => null;
var p = null;
do {
const a = [];
for (const g of navigator.getGamepads()) {
if (g) {
a.push(function() {
const pad = navigator.getGamepads().item(g.item);
if (pad) return pad;
});
}
}
if (a.length && !p) {
p = a[0];
yield p;
} else if (p && !a.length) {
p = null;
yield () => null;
}
await Promises.delay(500);
} while (true);
}
Insert cell
pad = {
var pad;
do {
yield (pad = gamepad());
} while (pad);
}
Insert cell
data = []
Insert cell
buttons = ({})
Insert cell
mutable debug2 = 0
Insert cell
{
if (pad) data.push(pad.axes);
while (data.length > 300) data.shift();
}
Insert cell
pad && pad.axes
Insert cell
pad && pad.buttons[0] && (buttons[0] = pad.buttons[0].value)
Insert cell
pad && pad.buttons[1] && (buttons[1] = pad.buttons[1].value)
Insert cell
{
const pad = gamepad();
if (!pad) return html`Plug in a GamePad.`;
if (!pad.vibrationActuator)
return html`This GamePad (${pad.id}) has no Actuator, sorry.`;

const button = html`<button>Actuator</button>`;
button.onclick = () =>
gamepad.vibrationActuator
? gamepad.vibrationActuator.playEffect("dual-rumble", {
startDelay: 0,
duration: 1000,
weakMagnitude: 1.0,
strongMagnitude: 1.0
})
: console.warn("no actuator");
return button;
}
Insert cell
d3 = require("d3@5")
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