How to optimize this minecraft code and make it run correctly?

Questions
1

The code is at:
view-source:http://voxeljs2.rf.gd/
There are 3 variables that are chunkSize, renderDistance and depth. I want depth at 5, renderDistance at 31 and chunkSize at 17. I know the game can run via eliminating the innerMeshes in the 4 terrain generation events and with pushing and releasing the blocks, but… how to make a perfect meshing with deleting the inner faces? Please respond!

2

Have a look at the source code of this example: three.js examples

3

Thanks! But… how to apply first person controls to that camera?

4

May this:

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/87/three.js"></script>
<script src="perlin.js"></script>
<script>
function render(){
	renderer.setSize(innerWidth,innerHeight)
	camera.aspect=innerWidth/innerHeight
	camera.updateProjectionMatrix()
	requestAnimationFrame(render)
	renderer.render(scene,camera)
	//This update the player.
	if(-1.5>ya){ya=-1.5}
	if(1.5<ya){ya=1.5}
	camera.position.x+=camera_xs
	camera.position.y+=camera_ys
	camera.position.z+=camera_zs
	camera_xs*=7/8
	camera_ys*=7/8
	camera_zs*=7/8
	camera.lookAt(
        camera.position.x+Math.sin(xa)*Math.cos(ya),
        camera.position.y+Math.sin(ya),
        camera.position.z+Math.cos(xa)*Math.cos(ya)
    )
    MovingSpeed=0.02
	if(k[65]){
		camera_xs+=MovingSpeed*Math.cos(xa)
		camera_zs-=MovingSpeed*Math.sin(xa)
	}
	if(k[87]){
		camera_xs+=MovingSpeed*Math.sin(xa)
		camera_zs+=MovingSpeed*Math.cos(xa)
	}
	if(k[68]){
		camera_xs-=MovingSpeed*Math.cos(xa)
		camera_zs+=MovingSpeed*Math.sin(xa)
	}
	if(k[83]){
		camera_xs-=MovingSpeed*Math.sin(xa)
		camera_zs-=MovingSpeed*Math.cos(xa)
	}
	if(k[32]){
		camera_ys+=MovingSpeed
	}
	if(k[88]){
		camera_ys-=MovingSpeed
	}
}
onmousedown=()=>{
  if(document.pointerLockElement===document.body||
  document.mozPointerLockElement===document.body){
  }else{
    document.body.requestPointerLock()
  }
}
onmousemove=(event)=>{
  if(document.pointerLockElement===document.body||
  document.mozPointerLockElement===document.body){
    xa-=0.01*event.movementX
    if(-1.5<ya&&0<event.movementY){
      ya-=0.01*event.movementY
    }
    if(ya<1.5&&event.movementY<0){
      ya-=0.01*event.movementY
    }
  }
}
onload=()=>{
	document.body.style.margin=0
	cube={}
	xa=0
	ya=0
	k=[]
	onkeydown=onkeyup=(e)=>{k[e.keyCode]=e.type=="keydown"}
	camera_xs=0
	camera_ys=0
	camera_zs=0
	document.title="My first Three.js app"
	document.body.style.margin=0
	scene=new THREE.Scene()
	camera=new THREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight,1,10000)
	renderer=new THREE.WebGLRenderer()
	document.body.appendChild(renderer.domElement);
	render()
}
</script>
5

Maybe this example will help: three.js examples

6

that code has hidden issues

1 Like
7

threejs version that I use is: http://voxeljs2.rf.gd/three.js
perlinjs version that I use is: http://voxeljs2.rf.gd/perlin.js
controls script version that I use is: http://voxeljs2.rf.gd/PointerLockControls.js

8

Hello, I tried to combine the two scripts but with no result, it gives me this error:
GET http://localhost/build/three.module.js net::ERR_ABORTED 404 (Not Found)
But I put the script in the correct location…