Is there a Option to make a custom GUI?

I wanna make for my game a Gui and i dont know how to Make this.
Can you pls Help me with this?

Cheers
Martin :slight_smile:

在我改编的河道漂流中,我试图有一个木筏视角,可添加后,摄像机不会随着木筏旋转而旋转,现在我又删了。请求帮助!
我的代码:https://www.code3dgames.com/3de/#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

因为我的帮助文本是中文,再次打开后会变成乱码,又因为不影响程序可以删除。

尝试使用如下代码定义 raft 相机:

  var aspectRatio = window.innerWidth / window.innerHeight;
  var camera = new THREE.PerspectiveCamera(75, aspectRatio, 0.1, 100);
  camera.position.set(-8, 8, 8);
  scene.add(camera);
  var abovecam = camera;  
  
  var qCam = new THREE.PerspectiveCamera(75, aspectRatio, 1, 10000);
  qCam.position.set(0, 0, 500);
  qCam.position.z = 1;
  qCam.rotation.z = Math.PI/2;
  qCam.rotation.y = Math.PI/2

将此相机添加到筏子:

function addRaft() {
  var shape = new THREE.TorusGeometry(0.1, 0.05, 8, 20);
  var _cover = new THREE.MeshPhongMaterial({visible: false});
  var cover = new Physijs.createMaterial(_cover, cover, 0.25);
  var mesh = new Physijs.ConvexMesh(shape, cover, 0.25);
  mesh.rotation.x = -Math.PI/2;
  
  var furFace = rColor();
    
  cover = new THREE.MeshPhongMaterial({color: furFace});
  var tube = new THREE.Mesh(shape, cover);
  tube.position.z = -0.08;
  tube.castShadow = true;
  mesh.add(tube);
  mesh.tube = tube;
  
  
  mesh.add(qCam);
  
  shape = new THREE.SphereGeometry(0.02);
  cover = new THREE.MeshBasicMaterial({color: 'white'});
  var rudder = new THREE.Mesh(shape, cover);
  rudder.position.set(0.15, 0, 0);
  tube.add(rudder);
  
  scene.add(mesh);
  mesh.setAngularFactor(new THREE.Vector3(0, 0, 0));
  return mesh;
}