The avatar for @mydu
mengy
data janitor
Public
Edited
Aug 3, 2023
4 stars
3
Insert cell
Insert cell
Insert cell
width = 900
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
quadtree = d3.quadtree()
.x(d => d.x)
.y(d => d.y)
.addAll(projection)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
projectionMap = new Map(projection.map((d) => [d.id, d]));
Insert cell
Insert cell
Insert cell
// function project(p){
// if(p) fisheye.focus(p);
// projection.forEach(d => {
// const s = sprites.get(d.id)
// // const f = fisheye([d.x, d.y]);
// if (s) {
// s.position.x = d.x
// s.position.y = d.y
// s.scale.set(scale)
// }
// })
// renderer.render(container)
// }
Insert cell
delay = 0
Insert cell
baseUrl = "https://mapping-datavis-dispatch.vercel.app/data/sprites/"
Insert cell
Insert cell
Insert cell
Insert cell
d3 = require("d3@5")
Insert cell
umap = clipembeds
Insert cell
import { renderer, container, PIXI } from "@cpietsch/pixi-renderer"
Insert cell
import {loadImage, loadTexture,extractSpriteTexture} from "68b54e3f54ebd551"
Insert cell
Insert cell
data = FileAttachment("spritesheet.json").json()
Insert cell
clipEmbeds.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
vecEmbeds.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Insert cell
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