bombinans/fourdjs
1
1
Fork 0
Code Issues 9 Pull Requests Packages Projects Releases Wiki Activity

This is throwing errors in vite and I don't know why

Browse Source
This commit is contained in:
Mike Lynch 2025-11-15 18:12:06 +11:00
parent 67348bce31
commit a2581a2f66
2 changed files with 49 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
linktest.js
View File

@ -1,10 +1,10 @@
import * as THREE from 'three';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
import { GUI } from 'lil-gui';
import { TaperedLink } from './taperedLink.js';
const FACE_OPACITY = 0.3;
const CAMERA_K = 5;
@ -27,13 +27,17 @@ scene.add(amblight);
camera.position.set(0, 0, CAMERA_K / 2);
camera.lookAt(0, 0, 0);
//camera.position.z = 4;
camera.position.z = 8;
const renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.localClippingEnabled = true;
const controls = new OrbitControls( camera, renderer.domElement );
controls.autoRotate = true;
document.body.appendChild( renderer.domElement );
@ -50,13 +54,13 @@ material.opacity = 0.5;
const node_mat = new THREE.MeshStandardMaterial({ color: NODEC });
node_mat.transparent = true;
node_mat.opacity = 0.1;
node_mat.opacity = 0.8;
const params = {
r1: 0.5,
r2: 0.6,
sync: false,
l: 3,
l: 9,
};
const gui = new GUI();
@ -64,7 +68,7 @@ const gui = new GUI();
gui.add(params, "r1", 0.01, 1.5);
gui.add(params, "r2", 0.01, 1.5);
gui.add(params, "sync");
gui.add(params, "l", 0, 4);
gui.add(params, "l", 0, 10);
function makeNode(material, pos, r) {
const geometry = new THREE.SphereGeometry(1);
@ -84,8 +88,8 @@ function updateNode(node, pos, r) {
}
const n1 = makeNode(node_mat, new THREE.Vector3(-0.5 * params["l"], 0, 0), params["r1"]);
const n2 = makeNode(node_mat, new THREE.Vector3(0.5 * params["l"], 0, 0), params["r2"]);
const n1 = makeNode(node_mat, new THREE.Vector3(-params["l"], -1, -1), params["r1"]);
const n2 = makeNode(node_mat, new THREE.Vector3(params["l"], 1, 1), params["r2"]);
const tl = new TaperedLink(material, n1, n2, params["r1"], params["r2"]);
@ -100,9 +104,10 @@ function animate() {
const r1 = params["r1"];
const r2 = params["sync"] ? r1 : params["r2"]
updateNode(n1, new THREE.Vector3(-0.5 * params["l"], 0, 0), r1);
updateNode(n2, new THREE.Vector3(0.5 * params["l"], 0, 0), r2);
updateNode(n1, new THREE.Vector3(- params["l"], -1, -1), r1);
updateNode(n2, new THREE.Vector3(params["l"], 1, 1), r2);
tl.update(n1, n2, r1, r2);
controls.update();
renderer.render(scene, camera);
}
animate();

84
taperedLink.js
View File

@ -1,33 +1,22 @@
import * as THREE from 'three';
// really stupid idea: add a cylinder as well!
const EPSILON = 0.01;
// wtf dude
class TaperedLink extends THREE.Group {
constructor(baseMaterial, n1, n2, r1, r2) {
super();
const cone = new THREE.ConeGeometry( 1, 1, 32, true );
//const geometry = new THREE.ConeGeometry( 1, 1, 32, true );
const geometry = new THREE.CylinderGeometry( 1, 1, 1, 16, 1, true);
const cplane = new THREE.Plane(new THREE.Vector3(0, -1, 0), 0.5);
const material = baseMaterial.clone();
// material.clippingPlanes = [ cplane ];
this.cone = new THREE.Mesh( cone, material );
this.add( this.cone );
// const cylinder = new THREE.CylinderGeometry(1, 1, 1, 16, 1, true);
// const cyl_material = baseMaterial.clone();
// cyl_material.color = new THREE.Color(0xff0000);
// this.cylinder = new THREE.Mesh(cylinder, cyl_material);
// this.add( this.cylinder );
// this.update(n1, n2, r1, r2);
this.object = new THREE.Mesh( geometry, material );
this.add( this.object );
this.update(n1, n2, r1, r2);
}
update(n1, n2, r1, r2) {
this.update_cone(n1, n2, r1, r2);
}
update_cone(n1, n2, r1, r2) {
update_cone_busted(n1, n2, r1, r2) {
const kraw = r1 - r2;
let k = ( kraw == 0 ) ? 0.001 : kraw;
let nbase = n1.v3;
@ -45,43 +34,40 @@ class TaperedLink extends THREE.Group {
const l = nbase.distanceTo(napex);
const lapex = l * rapex / k;
const h = l + lapex;
this.cone.scale.copy(new THREE.Vector3(rbase, h, rbase));
this.object.scale.copy(new THREE.Vector3(rbase, h, rbase));
const h_offset = 0.5 * h / l;
const pos = new THREE.Vector3();
pos.lerpVectors(nbase, napex, h_offset);
//if( h_offset > 1 ) {
// this.cone.scale.copy(new THREE.Vector3(rbase, -h, rbase));
//} {
// this.cone.scale.copy(new THREE.Vector3(rbase, h, rbase));
//}
this.lookAt(napex); // the group, not the cone!!
//this.scale.copy(new THREE.Vector3(rbase, h, rbase));
this.position.copy(pos); // the group, not the cone!!
this.cone.rotation.x = Math.PI / 2.0;
// this.cylinder.rotation.x = Math.PI / 2.0;
// const clipnorm = new THREE.Vector3();
// clipnorm.copy(napex);
// clipnorm.sub(nbase);
// clipnorm.negate();
// clipnorm.normalize();
// this.cone.material.clippingPlanes[0].setFromNormalAndCoplanarPoint(
// clipnorm, napex
// );
this.lookAt(napex);
this.rotation.y = Math.PI / 2.0;
/* const clipnorm = new THREE.Vector3();
clipnorm.copy(napex);
clipnorm.sub(nbase);
clipnorm.negate();
clipnorm.normalize();
this.cone.material.clippingPlanes[0].setFromNormalAndCoplanarPoint(
clipnorm, napex
);
*/
}
update_cylinder_busted(n1, n2, r1, r2) {
const length = n1.v3.distanceTo(n2.v3);
const centre = new THREE.Vector3();
centre.lerpVectors(n1.v3, n2.v3, 0.5);
const link_mean = (r1 + r2) * 0.5;
this.cylinder.scale.copy(new THREE.Vector3(link_mean, link_mean, length));
this.cylinder.position.copy(centre);
//this.cylinder.lookAt(n2.v3);
this.cylinder.rotation.x = Math.PI / 2.0;
}
}
update(n1, n2, r1, r2) {
const length = n1.v3.distanceTo(n2.v3);
const centre = new THREE.Vector3();
centre.lerpVectors(n1.v3, n2.v3, 0.5);
const link_mean = (r1 + r2) * 0.5;
this.scale.copy(new THREE.Vector3(link_mean, link_mean, length));
this.position.copy(centre);
this.lookAt(n2.v3);
this.children[0].rotation.x = Math.PI / 2.0;
this.visible = true;
}
export { TaperedLink };