From 9dc5b911faa66416194ff02630effa59bcd5ee64 Mon Sep 17 00:00:00 2001 From: TreetopFlyer Date: Mon, 12 Jul 2021 09:05:15 -0400 Subject: [PATCH] surface smoothing started --- index.html | 179 +++++++++++++++++++++++------------------------------ 1 file changed, 78 insertions(+), 101 deletions(-) diff --git a/index.html b/index.html index c214b72..c793b65 100644 --- a/index.html +++ b/index.html @@ -25,46 +25,12 @@ import { Region } from "./region.js"; let surfaceTest = () => { - let voxels = []; - voxels[Region.I(0, 0, 0)] = true; - voxels[Region.I(1, 0, 0)] = true; - let surface = Region.Surface(voxels) - console.log(surface); - - let surfaceGeometry = new THREE.BufferGeometry(); - surfaceGeometry.setAttribute('position', new THREE.BufferAttribute(new Float32Array(surface.vertices.flat()), 3) ); - surfaceGeometry.setIndex(surface.triPointVert); - surfaceGeometry.computeVertexNormals(true); - - let surfaceObject = new THREE.Mesh( - surfaceGeometry, - new THREE.MeshPhongMaterial({color:0xaa9900, side:THREE.DoubleSide, shading:THREE.FlatShading}) - ); - - return { - DOM:"canvas", - Init(inScene) - { - let light = new THREE.PointLight(0xffffff, 1, 100) - light.position.set(0, 2, -4); - inScene.add(light) - inScene.add(surfaceObject); - inScene.add(new THREE.GridHelper(10, 10)); - inScene.add(new THREE.AxesHelper( 5 )); - }, - Update(inScene, inDelta){} - }; - -} - -let smoothTest = () => -{ - let average = (inArray, inPointInd, ...inOthersInd) => + let average = (inArray, inPointInd, inOthersIndArray) => { let sum = [0, 0, 0]; - for(let i=0; i let pointX = inPointInd*3 + 0; let pointY = inPointInd*3 + 1; let pointZ = inPointInd*3 + 2; - let reducer = inOthersInd.length; + let reducer = inOthersIndArray.length; let limit = (inCenter, inPoint) => { + var size = 0.49999; var limit; - limit = inCenter-0.49; + limit = inCenter - size; if(inPoint <= limit) { return limit; } - limit = inCenter + 0.49; + limit = inCenter + size; if(inPoint >= limit) { return limit; @@ -94,80 +61,90 @@ let smoothTest = () => inArray[pointY] = limit(Math.round(inArray[pointY]), sum[1]/reducer); inArray[pointZ] = limit(Math.round(inArray[pointZ]), sum[2]/reducer); }; - let smooth = (inArray, inTimes) => + let smooth = (inVertsArray, inNeighborsArray, inTimes) => { - let count = inArray.length/3; + let count = inVertsArray.length/3; for(let t=0; t - { - let clone = [...inPoints]; - smooth(clone, inSmoothing); - const geometry = new THREE.BufferGeometry(); - geometry.setAttribute('position', new THREE.Float32BufferAttribute( clone, 3 )); - const materialLine = new THREE.LineBasicMaterial( { color: inColor, linewidth: 3 } ); - const materialPoint = new THREE.PointsMaterial( { color:inColor, size: 0.05 } ); - const output = new THREE.Group(); - - output.add( new THREE.Line( geometry, materialLine ) ); - output.add( new THREE.Points( geometry, materialPoint ) ); - return output; - } - const points = - [ - 4, 0, 0, - 3, 0, 0, - 2, 0, 0, - 1, 0, 0, - // - 0, 0, 0, - 0, 1, 0, - 1, 1, 0, - 2, 1, 0, - 2, 2, 0, - 3, 2, 0, - 4, 2, 0, - 4, 3, 0, - // - 5, 3, 0, - 5, 2, 0, - 5, 1, 0, - 5, 0, 0, - ]; + + let voxels = []; + voxels[Region.I(0, 0, 0)] = true; + voxels[Region.I(1, 0, 0)] = true; + voxels[Region.I(2, 0, 0)] = true; + voxels[Region.I(0, 1, 0)] = true; + voxels[Region.I(1, 1, 0)] = true; + voxels[Region.I(0, 2, 0)] = true; + + voxels[Region.I(0, 0, 1)] = true; + voxels[Region.I(1, 0, 1)] = true; + voxels[Region.I(2, 0, 1)] = true; + voxels[Region.I(0, 1, 1)] = true; + voxels[Region.I(1, 1, 1)] = true; + voxels[Region.I(0, 2, 1)] = true; + + voxels[Region.I(0, 0, 2)] = true; + voxels[Region.I(1, 0, 2)] = true; + voxels[Region.I(2, 0, 2)] = true; + voxels[Region.I(0, 1, 2)] = true; + voxels[Region.I(1, 1, 2)] = true; + voxels[Region.I(0, 2, 2)] = true; + + voxels[Region.I(0, 0, 3)] = true; + voxels[Region.I(1, 0, 3)] = true; + voxels[Region.I(2, 0, 3)] = true; + voxels[Region.I(0, 1, 3)] = true; + voxels[Region.I(1, 1, 3)] = true; + voxels[Region.I(0, 2, 3)] = true; + + + let surface = Region.Surface(voxels); + let vertsCube = new Float32Array(surface.vertices.flat()); + let surfaceCubeGeometry = new THREE.BufferGeometry(); + surfaceCubeGeometry.setAttribute('position', new THREE.BufferAttribute(vertsCube, 3) ); + surfaceCubeGeometry.setIndex(surface.triPointVert); + surfaceCubeGeometry.computeVertexNormals(true); + let surfaceCubeObject = new THREE.Mesh( + surfaceCubeGeometry, + new THREE.MeshBasicMaterial({color:0xaa9900, wireframe:true, side:THREE.DoubleSide, shading:THREE.FlatShading}) + ); + + + let vertsSmooth = new Float32Array(smooth(surface.vertices.flat(), surface.vertPointNeighbors, 5)); + let surfaceSmoothGeometry = new THREE.BufferGeometry(); + surfaceSmoothGeometry.setAttribute('position', new THREE.BufferAttribute(vertsSmooth, 3) ); + surfaceSmoothGeometry.setIndex(surface.triPointVert); + surfaceSmoothGeometry.computeVertexNormals(true); + let surfaceSmoothObject = new THREE.Mesh( + surfaceSmoothGeometry, + new THREE.MeshPhongMaterial({color:0xffffff, side:THREE.DoubleSide, shading:THREE.FlatShading}) + ); + + return { DOM:"canvas", Init(inScene) - { - inScene.add(path(points, 0, 0xFF0000)); - inScene.add(path(points, 10, 0x00ff00)); - }, - Update(scene, delta) - { + { + let light = new THREE.PointLight(0xffffff, 1, 100) + light.position.set(0, 2, -4); + inScene.add(light) + inScene.add(surfaceCubeObject); + inScene.add(surfaceSmoothObject); - } - } -}; + //inScene.add(new THREE.GridHelper(10, 10)); + //inScene.add(new THREE.AxesHelper( 5 )); + }, + Update(inScene, inDelta){} + }; + +} Scene(surfaceTest());