Javascript 如何更改这三个.js面的颜色？

我正在使用飞鸟对象的示例脚本。 但是我如何改变鸟的颜色呢？ 我尝试在这一行中更改它，其中鸟类被实例化：

bird=birds[i]=new THREE.Mesh（new bird（），new THREE.MeshBasicMaterial（{color:/*Math.random（）*0xffffff*/0x54A1D8，side:THREE.DoubleSide}））

但它没有改变

Bird.js

 var Bird = function () {

var scope = this;

THREE.Geometry.call( this );

v(   5,   0,   0 );
v( - 5, - 2,   1 );
v( - 5,   0,   0 );
v( - 5, - 2, - 1 );

v(   0,   2, - 6 );
v(   0,   2,   6 );
v(   2,   0,   0 );
v( - 3,   0,   0 );

f3( 0, 2, 1 );
// f3( 0, 3, 2 );

f3( 4, 7, 6 );
f3( 5, 6, 7 );

this.computeCentroids();
this.computeFaceNormals();




function v( x, y, z ) {

    scope.vertices.push( new THREE.Vector3( x, y, z ) );

}

function f3( a, b, c ) {


    scope.faces.push( new THREE.Face3( a, b, c ) );

}

}


Bird.prototype = Object.create( THREE.Geometry.prototype );


主脚本

        <script>

        var SCREEN_WIDTH = window.innerWidth,
        SCREEN_HEIGHT = window.innerHeight,
        SCREEN_WIDTH_HALF = SCREEN_WIDTH  / 2,
        SCREEN_HEIGHT_HALF = SCREEN_HEIGHT / 2;

        var camera, scene, renderer,
        birds, bird;

        var boid, boids;

        var stats;

        init();
        animate();

        function init() {

            camera = new THREE.PerspectiveCamera( 75, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 10000 );
            camera.position.z = 450;

            scene = new THREE.Scene();

            birds = [];
            boids = [];

            for ( var i = 0; i < 200; i ++ ) {

                boid = boids[ i ] = new Boid();
                boid.position.x = Math.random() * 400 - 200;
                boid.position.y = Math.random() * 400 - 200;
                boid.position.z = Math.random() * 400 - 200;
                boid.velocity.x = Math.random() * 2 - 1;
                boid.velocity.y = Math.random() * 2 - 1;
                boid.velocity.z = Math.random() * 2 - 1;
                boid.setAvoidWalls( true );
                boid.setWorldSize( 500, 500, 400 );

                bird = birds[ i ] = new THREE.Mesh( new Bird(), new THREE.MeshBasicMaterial( { color:/*Math.random() *0xffffff*/ 0x54A1D8, side: THREE.DoubleSide } ) );
                bird.phase = Math.floor( Math.random() * 62.83 );
                bird.position = boids[ i ].position;
                scene.add( bird );


            }

            renderer = new THREE.CanvasRenderer();
            // renderer.autoClear = false;
            renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
            document.addEventListener('click', triggerPlay, false);
            document.addEventListener( 'mousemove', onDocumentMouseMove, false );
            document.body.appendChild( renderer.domElement );

            /*stats = new Stats();
            stats.domElement.style.position = 'absolute';
            stats.domElement.style.left = '0px';
            stats.domElement.style.top = '0px';

            document.getElementById( 'container' ).appendChild(stats.domElement);

            //

            window.addEventListener( 'resize', onWindowResize, false );
            */
        }

        function onWindowResize() {

            camera.aspect = window.innerWidth / window.innerHeight;
            camera.updateProjectionMatrix();

            renderer.setSize( window.innerWidth, window.innerHeight );

        }

        function onDocumentMouseMove( event ) {

            var vector = new THREE.Vector3( event.clientX - SCREEN_WIDTH_HALF, - event.clientY + SCREEN_HEIGHT_HALF, 0 );

            for ( var i = 0, il = boids.length; i < il; i++ ) {

                boid = boids[ i ];

                vector.z = boid.position.z;

                boid.repulse( vector );

            }

        }

        //

        function animate() {

            requestAnimationFrame( animate );

            render();
            //stats.update();

        }

        function render() {

            for ( var i = 0, il = birds.length; i < il; i++ ) {

                boid = boids[ i ];
                boid.run( boids );

                bird = birds[ i ];

                color = bird.material.color;
                color.r = color.g = color.b = ( 500 - bird.position.z ) / 1000;

                bird.rotation.y = Math.atan2( - boid.velocity.z, boid.velocity.x );
                bird.rotation.z = Math.asin( boid.velocity.y / boid.velocity.length() );

                bird.phase = ( bird.phase + ( Math.max( 0, bird.rotation.z ) + 0.1 )  ) % 62.83;
                bird.geometry.vertices[ 5 ].y = bird.geometry.vertices[ 4 ].y = Math.sin( bird.phase ) * 5;

            }

            renderer.render( scene, camera );

        }

    </script>


var SCREEN_WIDTH=window.innerWidth，
屏幕高度=窗内高度，
屏幕宽度一半=屏幕宽度/2，
屏幕高度半=屏幕高度/2；
摄像机、场景、渲染器、，
鸟，鸟；
var boid，boid；
var统计；
init（）；
制作动画（）；
函数init（）{
摄像机=新的三个透视摄像机（75，屏幕宽度/屏幕高度，11000）；
摄像机位置z=450；
场景=新的三个。场景（）；
鸟类=[]；
boids=[]；
对于（变量i=0；i<200；i++）{
boid=boid[i]=新的boid（）；
boid.position.x=Math.random（）*400-200；
boid.position.y=Math.random（）*400-200；
boid.position.z=Math.random（）*400-200；
boid.velocity.x=Math.random（）*2-1；
boid.velocity.y=Math.random（）*2-1；
boid.velocity.z=Math.random（）*2-1；
boid.setAvoidWalls（真）；
boid.setWorldSize（500500400）；
bird=birds[i]=new THREE.Mesh（new bird（），new THREE.MeshBasicMaterial（{color:/*Math.random（）*0xffffff*/0x54A1D8，side:THREE.DoubleSide}））；
bird.phase=Math.floor（Math.random（）*62.83）；
bird.position=boids[i].位置；
场景。添加（鸟）；
}
renderer=new THREE.CanvasRenderer（）；
//renderer.autoClear=false；
设置大小（屏幕宽度、屏幕高度）；
document.addEventListener（'click'，triggerPlay，false）；
document.addEventListener（'mousemove'，onDocumentMouseMove，false）；
document.body.appendChild（renderer.doElement）；
/*统计数据=新统计数据（）；
stats.domElement.style.position='绝对'；
stats.domeElement.style.left='0px'；
stats.domElement.style.top='0px'；
document.getElementById（'container'）.appendChild（stats.doElement）；
//
addEventListener（'resize'，onWindowResize，false）；
*/
}
函数onWindowResize（）{
camera.aspect=window.innerWidth/window.innerHeight；
camera.updateProjectMatrix（）；
renderer.setSize（window.innerWidth、window.innerHeight）；
}
onDocumentMouseMove函数（事件）{
var vector=new THREE.Vector3（event.clientX-屏幕宽度对半，-event.clientY+屏幕高度对半，0）；
对于（var i=0，il=boids.length；i
正在渲染循环中设置颜色以模拟雾

color = bird.material.color;
color.r = color.g = color.b = ( 500 - bird.position.z ) / 1000;

嗯，这是在那里提到的。但它是在这行中设置的：
bird=birds[i]=new THREE.Mesh（new bird（），new THREE.MeshBasicMaterial（{color:/*Math.random（）*0xffffff*/0x54A1D8，side:THREE.DoubleSide}）正如我的更改所表明的，问题是，当我在这里更改十六进制代码时，它似乎没有改变颜色。不，真的-它在每个帧的渲染循环中都被重置。所以，如果你改变初始设置，这没什么大不了的。您所做的更改正在运行，它正在立即被覆盖。