Question

我的Three.js代码有问题。我想为我的太阳模拟器安装小行星带。所以我想使用THREE.Point（）对象。为此，我编写了一个函数，但它返回标题中的“类型错误”。

我在Ubuntu 19.10上使用THREE.js库，并且在使用Firefox 67.0.4。该问题也在Chrome中出现。下面的代码在我在init（）函数中调用的createAsteroidBelt（）函数中。

这是我的代码：我受到here的启发。

var dist = (data[jupiterId].distance + data[marsId].distance)/2;
var particleCount = 1000;
var asteroidsGeometry = new THREE.Geometry();

// now create the individual particles
for (let i = 0; i < particleCount; i++) {
    // create a particle with random position
    var asteroidOrbit = dist + THREE.Math.randFloat(-10, 10);
    var coord = new THREE.Vector3();
    coord.x = Math.cos(THREE.Math.randFloat(0, 2*Math.PI)) * asteroidOrbit;
    coord.y = THREE.Math.randFloat(-2, 2);
    coord.z = Math.sin(THREE.Math.randFloat(0, 2*Math.PI)) * asteroidOrbit;
    asteroidsGeometry.vertices.push(coord);
}

var asteroids = new THREE.Points(asteroidsGeometry, new THREE.PointsMaterial({
    size: 20
}));
asteroids.name = "Asteroid Belt";
planets[solarSystemId].add(asteroids);

错误正好在此行：

var asteroids = new THREE.Points(asteroidsGeometry, new THREE.PointsMaterial({
    size: 20
}));

这里是错误的堆栈：

updateMorphTargets file:///.../libraries/three.min.js:672
ac file:///.../libraries/three.min.js:216
createAsteroidBelt file:///.../main.js:363
init file:///.../main.js:478
<anonima> file:///.../main.js:612

我不明白此错误的原因。

已解决错误 感谢@jeffld解决错误。现在我对小行星带的形状有疑问。它具有正方形而不是环形。这是一张照片： Asteroid belt shape

最终解决方案 我也解决了最后一个错误。问题是我为coordX和coordY生成了不同的角度，而不是使用相同的角度。这里是代码的正确部分：

var asteroidOrbit = dist + THREE.Math.randFloat(-10, 10);
var angle = THREE.Math.randFloat(0, 2*Math.PI);
var coord = new THREE.Vector3();
coord.x = Math.cos(angle) * asteroidOrbit;
coord.y = THREE.Math.randFloat(-2, 2);
coord.z = Math.sin(angle) * asteroidOrbit;
asteroidsGeometry.vertices.push(coord);

非常感谢大家的帮助：）。

Answer 1

这是three.js中的未解决问题。

该对象缺少morphAttributes对象（即使它为空）。

您可以通过在推送后添加以下行来解决此问题：

asteroidsGeometry.vertices.push(coord);
asteroidsGeometry.morphAttributes = {};

TypeError：无法使用THREE.Points（）

1 个答案: