camera frustrum test

Author: michaljaz

src/scripts/Setup.js

@@ -1,6 +1,6 @@
 import Stats from 'three/examples/jsm/libs/stats.module.js'
 import * as dat from 'three/examples/jsm/libs/dat.gui.module.js'
-import { WebGLRenderer, Scene, PerspectiveCamera, AmbientLight } from 'three'
+import { WebGLRenderer, Scene, PerspectiveCamera, AmbientLight, Mesh, BoxGeometry, MeshBasicMaterial } from 'three'
 import { DistanceBasedFog } from './rendering/DistanceBasedFog.js'
 import { UrlParams } from './UrlParams.js'
 import { gpuInfo } from './additional/gpuInfo.js'

src/scripts/index.js

@@ -1,4 +1,4 @@
-import { Color } from 'three'
+import { Color, Mesh, Matrix4, Frustum } from 'three'
 import { TWEEN } from 'three/examples/jsm/libs/tween.module.min.js'
 import swal from 'sweetalert'
 import { AssetLoader } from './AssetLoader.js'
@@ -13,7 +13,7 @@ class Game {
       console.log('Running in development mode')
     }
     this.fov = {
-      normal: 60,
+      normal: 70,
       sprint: 80
     }
     this.al = new AssetLoader()
@@ -122,6 +122,25 @@ class Game {
     this.socket.on('digTime', (time) => {
       this.bb.startDigging(time)
     })
+    setInterval(() => {
+      const frustum = new Frustum()
+      const cameraViewProjectionMatrix = new Matrix4()
+
+      this.camera.updateMatrixWorld()
+      this.camera.matrixWorldInverse.copy(this.camera.matrixWorld).invert()
+      cameraViewProjectionMatrix.multiplyMatrices(this.camera.projectionMatrix, this.camera.matrixWorldInverse)
+      frustum.setFromProjectionMatrix(cameraViewProjectionMatrix)
+
+      this.scene.traverse((node) => {
+        if (node instanceof Mesh) {
+          if (frustum.intersectsObject(node)) {
+            node.visible = true
+          } else {
+            node.visible = false
+          }
+        }
+      })
+    }, 1000)
     return this.animate()
   }
 
@@ -167,6 +186,7 @@ class Game {
     if (this.eh.gameState === 'inventory') {
       this.pii.render()
     }
+
     this.renderer.render(this.scene, this.camera)
   }
 }

src/scripts/rendering/DistanceBasedFog.js

@@ -43,7 +43,7 @@ class DistanceBasedFog {
           'float dist = length(u_viewPos - vViewPosition);',
           'float fogFactor = smoothstep(u_farnear.x, u_farnear.y, dist);',
           'gl_FragColor = vec4(outgoingLight, diffuseColor.a );',
-          'gl_FragColor = mix(gl_FragColor, u_fogColor, max(0.05, fogFactor));'
+          'gl_FragColor = mix(gl_FragColor, u_fogColor, fogFactor);'
         ].join('\n')
       )
     }

src/scripts/world/chunk.worker.js

@@ -86,6 +86,7 @@ class TerrainManager {
     let nearestDistance = -1
     let isNearest = false
     for (const chunkId in this.chunkNeedsUpdate) {
+      const pos = chunkTerrain.strToVec(chunkId)
       const dist = this.distance(chunkId)
       if (
         (nearestDistance === -1 || nearestDistance > dist) &&

src/webpack.common.js

@@ -5,9 +5,6 @@ const LodashModuleReplacementPlugin = require('lodash-webpack-plugin')
 const webpack = require('webpack')
 
 const config1 = {
-  optimization: {
-    runtimeChunk: 'single'
-  },
   entry: {
     main: path.join(__dirname, 'scripts/index.js'),
     bootstrap: [path.join(__dirname, 'styles/style.scss'), 'bootstrap']