function approxDeriv(f, h = 0.00000001) {
return x => (f(x + h) - f(x)) / h;
}
function approxDerivRtoR2(f, h = 0.00000001) {
const dx = x => (f(x + h)[0] - f(x)[0]) / h;
const dy = x => (f(x + h)[1] - f(x)[1]) / h;
return x => [dx(x), dy(x)];
}
height = width/2
spiralCamera = {
const fov = 25;
const near = 0.1;
const far = 10000;
const camera = new THREE.PerspectiveCamera(fov, 1, near, far);
camera.lookAt(new THREE.Vector3(0, 0, 0));
camera.position.set(60, 50, 35);
yield camera;
}
spiralMaxT = 18
function spiral(t) {
const r = 5;
const h = 1;
const x = r * Math.sin(t);
const y = r * Math.cos(t);
const z = h * t;
return [x, z, y];
}
spiralScene = {
const scene = new THREE.Scene();
scene.background = new THREE.Color(0xffffff);
const positions = [];
const colors = [];
for (let i = 0; i < spiralMaxT; i += 0.1) {
positions.push(...spiral(i));
}
const lineGeo = new THREE.BufferGeometry();
lineGeo.addAttribute(
'position',
new THREE.Float32BufferAttribute(positions, 3)
);
const lineMat = new THREE.LineBasicMaterial({
color: 0x000000
});
const line = new THREE.Line(lineGeo, lineMat);
scene.add(line);
const gridHelper = new THREE.GridHelper(30, 1);
scene.add(gridHelper);
yield scene;
}
import { slider } from '@jashkenas/inputs'
import { circle, line, triangle, coordsFromDeg } from '@timhau/geometry'
import { sn, note } from '@liuyao12/sidenotes'
import { inputsGroup } from '@bumbeishvili/input-groups'
THREE = {
const THREE = (window.THREE = await require("three@0.99.0/build/three.min.js"));
await require("three@0.99.0/examples/js/controls/OrbitControls.js").catch(
() => {}
);
return THREE;
}
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.
