无法读取 CubeCamera.updateCooperativeSystem 处未定义的属性（读取“向上”）

Question

自从我看到我的这个

three.js

项目以来已经有几年了（当有人输入全名

PlaneBufferGeometry

时）。它包含许多车辆，应通过

CubeCamera

反映它们周围（以及彼此之间）的环境。但是，当我激活此选项时，出现以下错误：

Uncaught TypeError: Cannot read properties of undefined (reading 'up')
at CubeCamera.updateCoordinateSystem (three.module.js:12739:13)
at CubeCamera.update (three.module.js:12803:9)
at CLASS_drone.update (blend.levels.php:2960:19)

这就是

CLASS_drone

中发生的事情：

function CLASS_drone(x,y,z,path,pts)
{
    this.x = x;
    this.y = y+0.25;
    this.z = z;
    this.path = path;
    this.ptstart = pts;
    this.pts = pts;
    this.drone = new THREE.Group();
    this.body = drone.clone();
    this.bidx = 0;
    this.widx = 0;
    this.fps = 0;
    for(var i = 0; i < this.body.children.length; i++)
    {
        if(this.body.children[i].name == "BODY")
            this.bidx = i;
        if(this.body.children[i].name == "WINDOW")
            this.widx = i;
    }
    this.drone.add(this.body);
    this.drone.position.set(this.x,this.y,this.z);
    this.CRT = new THREE.WebGLCubeRenderTarget( 32, { format: THREE.RGBFormat, generateMipmaps: true, minFilter: THREE.LinearMipmapLinearFilter } );
    this.cubecam = new THREE.CubeCamera(0.1, 3, this.CRT);
    this.envset = document.getElementById("qcubemap").checked;
//  this.drone.add(this.cubecam);
    this.drone.traverse(function(item)
    {
        if(item.isMesh)
        {
            if(item.name=="WINDOW")
                item.material = new THREE.MeshBasicMaterial({color:0x00FFFF,reflectivity:0.75});
            else if(item.name=="LAMP")
                item.material = matph_drLmp;
            else if(item.name=="BODY")
                item.material = new THREE.MeshBasicMaterial({color:0xFFFFFF,reflectivity:0.5});
            else
                item.material = matph_drBod;
            item.material.needsUpdate = true;
        }
    });
    this.body.children[this.bidx].material.envMap = this.CRT.texture;
    this.body.children[this.widx].material.envMap = this.CRT.texture;
    ...
    this.update = function(raftime)
    {
        if(this.active==true)
        {
            if(this.body.visible==true)
            {
                if(camera.position.distanceTo(this.drone.position)<10 && document.getElementById("qcubemap").checked==true && raftime > this.fps + (timing * 5))
                {
                    this.cubecam.clear(renderer);
                    this.drone.visible = false;
                    this.cubecam.position.copy(this.drone.position);
    >>              this.cubecam.update(renderer,scene);
                    this.drone.visible = true;
                    this.fps = raftime;
                }

这就是我加载的方式

three.js

：

<script type="importmap">
{
    "imports":
    {
        "three": "https://threejs.org/build/three.module.js",
        "OBJLoader": "https://threejs.org/examples/jsm/loaders/OBJLoader.js"
    }
}
</script>

Answer 1

CubeCamera

包含 6 个

PerspectiveCamera

对象作为其

children

（

children

继承自

Object3D

）。

错误来自尝试设置其中一台摄像机的

up

值的线路。这是说相机不存在。

你正在毁坏相机...

this.update = function(raftime)
    {
        if(this.active==true)
        {
            if(this.body.visible==true)
            {
                if(camera.position.distanceTo(this.drone.position)<10 && document.getElementById("qcubemap").checked==true && raftime > this.fps + (timing * 5))
                {
                    this.cubecam.clear(renderer); // !!! Here !!!

clear

函数继承自

Object3D

，只是删除对象的所有

children

。因此，通过在

this.cubecam

上调用它，您将清空其

children

，即 6 个

PerspectiveCamera

。