rint = (n) => Math.floor(r() * n)
noise = (u, v, target) => {
// klein bottle
u *= Math.PI;
v *= 2 * Math.PI;
u = u * 2;
let x, z;
if (u < Math.PI) {
x =
3 * Math.cos(u) * (1 + Math.sin(u)) +
2 * (1 - Math.cos(u) / 2) * Math.cos(u) * Math.cos(v);
z =
-8 * Math.sin(u) - 2 * (1 - Math.cos(u) / 2) * Math.sin(u) * Math.cos(v);
} else {
x =
3 * Math.cos(u) * (1 + Math.sin(u)) +
2 * (1 - Math.cos(u) / 2) * Math.cos(v + Math.PI);
z = -8 * Math.sin(u);
}
const y = -2 * (1 - Math.cos(u) / 2) * Math.sin(v);
target.set(x, y, z);
}
scene = {
const scene = new THREE.Scene();
scene.background = new THREE.Color(0x001b42);
//manufacture
genererFigures.figures.forEach((fig) => {
var geometry;
if (fig.geometry.type === "ParametricGeometry") {
// welcome to the jungle
//console.log(genererFigures.parametric[fig.geometry.args[0]]);
geometry = new THREE.ParametricGeometry(
genererFigures.parametric[fig.geometry.args[0]],
fig.geometry.args[1],
fig.geometry.args[2]
);
} else {
geometry = new THREE[fig.geometry.type](...fig.geometry.args);
}
console.log(geometry);
var edgeGeometry;
if (fig.lines) {
edgeGeometry = new THREE.EdgesGeometry(geometry);
}
var pos = new THREE.Vector3(fig.pos.x, fig.pos.y, fig.pos.z);
var rot = new THREE.Vector3(fig.rot.x, fig.rot.y, fig.rot.z);
if (fig.scale) {
var scale = new THREE.Vector3(fig.scale.x, fig.scale.y, fig.scale.z);
}
if (fig.lines) {
const line = new THREE.LineSegments(edgeGeometry, lineMaterial);
line.position.set(pos.x, pos.y, pos.z);
line.rotation.set(rot.x, rot.y, rot.z);
if (fig.scale) {
line.scale.set(scale.x, scale.y, scale.z);
}
scene.add(line);
}
if (fig.hatch) {
const hatch = new THREE.Mesh(geometry, hatchMaterial);
hatch.position.set(pos.x, pos.y, pos.z);
hatch.rotation.set(rot.x, rot.y, rot.z);
if (fig.scale) {
hatch.scale.set(scale.x, scale.y, scale.z);
}
scene.add(hatch);
}
if (fig.full) {
const full = new THREE.Mesh(geometry, fullMaterial);
full.position.set(pos.x, pos.y, pos.z);
full.rotation.set(rot.x, rot.y, rot.z);
if (fig.scale) {
full.scale.set(scale.x, scale.y, scale.z);
}
scene.add(full);
}
});
return scene;
}
hatchMaterial = new THREE.MeshBasicMaterial({
color: "white",
side: THREE.DoubleSide,
wireframe
})
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.
