Computer Graphics & Visualization @ufrj.br
Public
Edited
Jan 19, 2023
2 forks
5 stars
//
// A shuffle function that gives predictable results depending on the seed
//
shuffler = (seed) => d3.shuffler(d3.randomLcg(seed))
circleDatasets = ({
"3 circles A": [
[0, -Math.sqrt(3) / 4, 0.5],
[-0.5, Math.sqrt(3) / 4, 0.5],
[0.5, Math.sqrt(3) / 4, 0.5]
],
"4 circles A": [
[0.5, 0.5, 0.5],
[-0.5, 0.5, 0.5],
[0.5, -0.5, 0.5],
[-0.5, -0.5, 0.5]
],
"4 circles B": [
[0.35, 0.35, 0.4],
[-0.35, 0.35, 0.4],
[0.35, -0.35, 0.4],
[-0.35, -0.35, 0.4]
],
"5 circles A": [
[0.5, 0.5, 0.5],
[-0.5, 0.5, 0.5],
[0.5, -0.5, 0.5],
[-0.5, -0.5, 0.5],
[0, 0, 0.75 / 2]
],
"5 circles B": [
[0.5, 0.5, 0.5],
[-0.5, 0.5, 0.5],
[0.5, -0.5, 0.5],
[-0.5, -0.5, 0.5],
[0, 0, 0.2]
],
"5 circles C": [
[0, -Math.sqrt(3) / 4, 0.5],
[-1, -Math.sqrt(3) / 4, 0.5],
[1, -Math.sqrt(3) / 4, 0.5],
[-0.5, Math.sqrt(3) / 4, 0.5],
[0.5, Math.sqrt(3) / 4, 0.5]
],
"5 circles D": [
[0, -Math.sqrt(3) / 4, 0.5],
[-0.5, -Math.sqrt(3) / 4, 0.5],
[0.5, -Math.sqrt(3) / 4, 0.5],
[-0.5, Math.sqrt(3) / 4, 0.5],
[0.5, Math.sqrt(3) / 4, 0.5]
],
"6 circles A": [
[-0.25, -Math.sqrt(3) / 4, 0.5],
[0.25, -Math.sqrt(3) / 4, 0.5],
[-0.25, Math.sqrt(3) / 4, 0.5],
[0.25, Math.sqrt(3) / 4, 0.5],
[-0.75, 0, 0.5],
[0.75, 0, 0.5]
],
"6 circles B": [
[-0.25, -Math.sqrt(3) / 4, 0.25],
[0.25, -Math.sqrt(3) / 4, 0.25],
[-0.25, Math.sqrt(3) / 4, 0.25],
[0.25, Math.sqrt(3) / 4, 0.25],
[-0.5, 0, 0.25],
[0.5, 0, 0.25]
],
"7 circles A": [
[-0.25, -Math.sqrt(3) / 4, 0.25],
[0.25, -Math.sqrt(3) / 4, 0.25],
[-0.25, Math.sqrt(3) / 4, 0.25],
[0.25, Math.sqrt(3) / 4, 0.25],
[-0.5, 0, 0.25],
[0.5, 0, 0.25],
[0, 0, 0.25]
],
"7 circles B": [
[-0.25, -Math.sqrt(3) / 4, 0.5],
[0.25, -Math.sqrt(3) / 4, 0.5],
[-0.25, Math.sqrt(3) / 4, 0.5],
[0.25, Math.sqrt(3) / 4, 0.5],
[-0.5, 0, 0.5],
[0.5, 0, 0.5],
[0, 0, 0.5]
],
"7 circles C": [
[-0.25, -Math.sqrt(3) / 4, 0.5],
[0.25, -Math.sqrt(3) / 4, 0.5],
[-0.25, Math.sqrt(3) / 4, 0.5],
[0.25, Math.sqrt(3) / 4, 0.5],
[-0.75, 0, 0.5],
[0.75, 0, 0.5],
[0, 0, 0.5]
],
"7 circles D": [
[0, -Math.sqrt(3) / 4, 0.5],
[-1, -Math.sqrt(3) / 4, 0.5],
[1, -Math.sqrt(3) / 4, 0.5],
[-0.5, Math.sqrt(3) / 4, 0.5],
[0.5, Math.sqrt(3) / 4, 0.5],
[-0.25, 0, 0.3],
[0.25, 0, 0.3]
],
"8 circles A": [
[0.5, 0.5, 0.5],
[-0.5, 0.5, 0.5],
[0.5, -0.5, 0.5],
[-0.5, -0.5, 0.5],
[0.25, 0, 0.2],
[0, 0.25, 0.2],
[0, -0.25, 0.2],
[-0.25, 0, 0.2]
],
"8 circles B": [
[0.5, 0.5, 0.5],
[-0.5, 0.5, 0.5],
[0.5, -0.5, 0.5],
[-0.5, -0.5, 0.5],
[0.5, 0, 0.5],
[0, 0.5, 0.5],
[0, -0.5, 0.5],
[-0.5, 0, 0.5]
],
"8 circles C": [
[0.25, 0, 0.1],
[0, 0.25, 0.1],
[0, -0.25, 0.1],
[-0.25, 0, 0.1],
[0.5, 0.5, 0.5],
[-0.5, 0.5, 0.5],
[0.5, -0.5, 0.5],
[-0.5, -0.5, 0.5]
],
"9 circles A": [
[0.5, 0.5, 0.5],
[-0.5, 0.5, 0.5],
[0.5, -0.5, 0.5],
[-0.5, -0.5, 0.5],
[0.25, 0, 0.2],
[0, 0.25, 0.2],
[0, -0.25, 0.2],
[-0.25, 0, 0.2],
[0, 0, 0.2]
]
})
import { swatches } from "@d3/color-schemes"
gpuio = require("gpu-io")
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.
