＆＃34;随机＆＃34;中的不受欢迎的行明星一代

Question

我在three.js场景中创建了一个星空。生成星星随机位置的代码如下。当渲染星星并且从场景中心拉回相机时，有几个可见的空白＆＃34;轨道中的星星位置。

我假设它与_addStars方法中的数学有关。任何人都可以帮我收紧整个画布中星星的位置吗？

注意：我必须使用的画布大约是8：1比例高度：宽度。因此，重新定位相机不是一种选择。

更新：我已经添加了一个小提示来证明这个问题：https://jsfiddle.net/scottwatkins/5zjoLLpx/5/

/** Method to generate the stars and place them in the particle system */
_addStars: function () {
    var starColors = [];
    var starGeometry = new THREE.Geometry();
    starGeometry.colors = starColors;

    for (var i = 0; i < this.totalStars; i++) {

        var x = 120 - Math.random() * 1040;
        var y = 480 - Math.random() * 1040;
        var z = 0 - Math.random() * 1040;

        starGeometry.vertices.push( new THREE.Vector3( x, y, z ) );
        var starColor = new THREE.Color(0xffffff);
        starColor.setRGB(
            .8 + Math.random() * .2,
            .8 + Math.random() * .2,
            .8 + Math.random() * .2);
        starColors.push(starColor)

    }

    var starMaterial = new THREE.PointsMaterial( {
        size: 2.0,
        map: this.starTexture,
        depthTest: false,
        depthWrite: false,
        blending: THREE.AdditiveBlending,
        transparent : true,
        vertexColors: true
    } );

    this.particleSystem = new THREE.Points( starGeometry, starMaterial );

    this.scene.add(this.particleSystem);
}

Answer 1

似乎是由Math.random()似乎与THREE.Math.random16()

一起使用造成的

        var x = 120 - THREE.Math.random16() * 1040;
        var y = 480 - THREE.Math.random16() * 1040;
        var z = 0 - THREE.Math.random16() * 1040;

以下是THREE.Math.random16()文档中的内容：

从0到1的随机浮点数，具有16位随机性。 当应用于更大的空间时，标准Math.random（）会创建重复的模式。

更新了小提琴： here