app
Base Scaffold Control Panel
Public Made by Adomby adom
The Base Scaffold System's control panel: electrical specifications and the connect/disconnect interface between a base scaffold and the workcell ecosystem.
← Commit history
3D viewers: RoomEnvironment + ACES tone mapping so PCB green reads true
2 files changed
+10−6
docs/3d-scaffold.html+5−3@@ -22,16 +22,18 @@ canvas{display:block} import * as THREE from 'three'; import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js';+import { RoomEnvironment } from 'three/addons/environments/RoomEnvironment.js'; const st=m=>{const el=document.getElementById('load');if(el)el.textContent=m;}; const renderer=new THREE.WebGLRenderer({antialias:true});-renderer.outputColorSpace=THREE.SRGBColorSpace;renderer.setPixelRatio(Math.min(devicePixelRatio,2));+renderer.outputColorSpace=THREE.SRGBColorSpace;renderer.toneMapping=THREE.ACESFilmicToneMapping;renderer.toneMappingExposure=1.15;renderer.setPixelRatio(Math.min(devicePixelRatio,2)); renderer.setSize(innerWidth,innerHeight);document.body.appendChild(renderer.domElement); const scene=new THREE.Scene(); const bg=document.createElement('canvas');bg.width=2;bg.height=256;const bx=bg.getContext('2d'); const gr=bx.createLinearGradient(0,0,0,256);gr.addColorStop(0,'#1e2a3d');gr.addColorStop(.2,'#1e2a3d');gr.addColorStop(1,'#0a121f'); bx.fillStyle=gr;bx.fillRect(0,0,2,256);scene.background=new THREE.CanvasTexture(bg);-scene.add(new THREE.HemisphereLight(0xdfeeff,0x2a3040,2.1));scene.add(new THREE.AmbientLight(0xffffff,1.15));-const key=new THREE.DirectionalLight(0xfff0d8,1.9);key.position.set(.6,1,.8);scene.add(key);const fill=new THREE.DirectionalLight(0xa8c8ff,0.9);fill.position.set(-.7,.4,.6);scene.add(fill);+const pmrem=new THREE.PMREMGenerator(renderer);scene.environment=pmrem.fromScene(new RoomEnvironment(),0.04).texture;+scene.add(new THREE.HemisphereLight(0xdfeeff,0x2a3040,1.0));scene.add(new THREE.AmbientLight(0xffffff,0.35));+const key=new THREE.DirectionalLight(0xfff0d8,1.3);key.position.set(.6,1,.8);scene.add(key);const fill=new THREE.DirectionalLight(0xa8c8ff,0.6);fill.position.set(-.7,.4,.6);scene.add(fill); const bottomLight=new THREE.DirectionalLight(0xbfd7ff,0);bottomLight.position.set(0,-1,.2);scene.add(bottomLight); const camera=new THREE.PerspectiveCamera(35,innerWidth/innerHeight,.001,100); const controls=new OrbitControls(camera,renderer.domElement);controls.enableDamping=true;controls.zoomToCursor=true;
docs/3d-workcell.html+5−3@@ -22,16 +22,18 @@ canvas{display:block} import * as THREE from 'three'; import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js'; import { OrbitControls } from 'three/addons/controls/OrbitControls.js';+import { RoomEnvironment } from 'three/addons/environments/RoomEnvironment.js'; const st=m=>{const el=document.getElementById('load');if(el)el.textContent=m;}; const renderer=new THREE.WebGLRenderer({antialias:true});-renderer.outputColorSpace=THREE.SRGBColorSpace;renderer.setPixelRatio(Math.min(devicePixelRatio,2));+renderer.outputColorSpace=THREE.SRGBColorSpace;renderer.toneMapping=THREE.ACESFilmicToneMapping;renderer.toneMappingExposure=1.15;renderer.setPixelRatio(Math.min(devicePixelRatio,2)); renderer.setSize(innerWidth,innerHeight);document.body.appendChild(renderer.domElement); const scene=new THREE.Scene(); const bg=document.createElement('canvas');bg.width=2;bg.height=256;const bx=bg.getContext('2d'); const gr=bx.createLinearGradient(0,0,0,256);gr.addColorStop(0,'#1e2a3d');gr.addColorStop(.2,'#1e2a3d');gr.addColorStop(1,'#0a121f'); bx.fillStyle=gr;bx.fillRect(0,0,2,256);scene.background=new THREE.CanvasTexture(bg);-scene.add(new THREE.HemisphereLight(0xdfeeff,0x2a3040,2.1));scene.add(new THREE.AmbientLight(0xffffff,1.15));-const key=new THREE.DirectionalLight(0xfff0d8,1.9);key.position.set(.6,1,.8);scene.add(key);const fill=new THREE.DirectionalLight(0xa8c8ff,0.9);fill.position.set(-.7,.4,.6);scene.add(fill);+const pmrem=new THREE.PMREMGenerator(renderer);scene.environment=pmrem.fromScene(new RoomEnvironment(),0.04).texture;+scene.add(new THREE.HemisphereLight(0xdfeeff,0x2a3040,1.0));scene.add(new THREE.AmbientLight(0xffffff,0.35));+const key=new THREE.DirectionalLight(0xfff0d8,1.3);key.position.set(.6,1,.8);scene.add(key);const fill=new THREE.DirectionalLight(0xa8c8ff,0.6);fill.position.set(-.7,.4,.6);scene.add(fill); const bottomLight=new THREE.DirectionalLight(0xbfd7ff,0);bottomLight.position.set(0,-1,.2);scene.add(bottomLight); const camera=new THREE.PerspectiveCamera(35,innerWidth/innerHeight,.001,100); const controls=new OrbitControls(camera,renderer.domElement);controls.enableDamping=true;controls.zoomToCursor=true;