From 702df89634a99bdec20b48cdd9ff8a95fb15b8a2 Mon Sep 17 00:00:00 2001
From: Mike Lynch <mike@mikelynch.org>
Date: Sat, 22 Jul 2023 13:40:01 +1000
Subject: [PATCH] More tinkering with geometry

---
 main.js | 43 +++++++++++++++++++++++++++++--------------
 1 file changed, 29 insertions(+), 14 deletions(-)

diff --git a/main.js b/main.js
index dad408e..0c0d212 100644
--- a/main.js
+++ b/main.js
@@ -3,18 +3,17 @@ import * as THREE from 'three';
 const NODE_SIZE = 0.2;
 const LINK_SIZE = 0.1;
 
-function makeShape(graph) {
+function makeWireFrame(link_m, node_m, graph) {
 	const nodeids = {}
 	const group = new THREE.Group();
 	for ( const n of graph.nodes ) {
 		nodeids[n.id] = [ n.x, n.y, n.z ];
-		const geometry = new THREE.SphereGeometry(NODE_SIZE, NODE_SIZE,NODE_SIZE);
-		const material = new THREE.MeshBasicMaterial({color: 0x00ff00});
-		const sphere = new THREE.Mesh(geometry, material);
+		const geometry = new THREE.SphereGeometry(NODE_SIZE);
+		const sphere = new THREE.Mesh(geometry, mode_m);
 		group.add(sphere);
-		sphere.x = n.x;
-		sphere.y = n.y;
-		sphere.z = n.z;
+		sphere.position.x = n.x;
+		sphere.position.y = n.y;
+		sphere.position.z = n.z;
 	}
 	return group;
 }
@@ -44,10 +43,6 @@ const renderer = new THREE.WebGLRenderer();
 renderer.setSize( window.innerWidth, window.innerHeight );
 document.body.appendChild( renderer.domElement );
 
-// const geometry = new THREE.BoxGeometry( 1, 1, 1 );
-// const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
-// const cube = new THREE.Mesh( geometry, material );
-// scene.add( cube );
 
 const group = new THREE.Group();
 
@@ -56,12 +51,34 @@ const sphere_m = new THREE.MeshBasicMaterial( { color: 0x33ff00 } );
 const sphere = new THREE.Mesh( sphere_g, sphere_m );
 group.add( sphere );
 
+sphere.position.x = -2;
+
+const sphere2_g = new THREE.SphereGeometry( 1 );
+const sphere2 = new THREE.Mesh( sphere_g, sphere_m );
+group.add( sphere2 );
+
+
+sphere2.position.x = 2;
+
+
 const cyl_g = new THREE.CylinderGeometry( 0.2, 0.2, 4 );
 const cyl_m = new THREE.MeshBasicMaterial( { color: 0x009930 } );
 const cyl = new THREE.Mesh( cyl_g, cyl_m );
 group.add( cyl );
 
 
+// const shape = makeShape({
+// 	nodes: [
+// 		{ id: 1, x: -10, y: -10, z: -10 },
+// 		{ id: 2, x: 10, y: 10, z: 10}
+// 	],
+// 	links: [
+// 		{ id: 1, source: 1, target: 1 }
+// 	]
+// });
+
+
+
 scene.add(group);
 
 
@@ -73,10 +90,8 @@ let tick = 0;
 function animate() {
 	requestAnimationFrame( animate );
 
-	group.rotation.x = tick;
+	group.position.x = Math.sin(tick) * 2;
 	group.rotation.y = tick;
-	cyl.position.y = Math.sin(tick * 10) * 0.4;
-	cyl.rotation.x = tick * 2;
 
 	tick += 0.01;
 	renderer.render( scene, camera );