Question

我正在尝试实现Stemkoskis优秀的粒子引擎（http://stemkoski.github.io/Three.js/Particle-Engine.html）但是有多个他的“类”实例。但问题是，在添加多个实例时，所有其他实例都会获得有关补间大小（sizeTween）的最后添加的实例属性

这是他的来源： http://stemkoski.github.io/Three.js/js/ParticleEngine.js

实例化： http://stemkoski.github.io/Three.js/js/ParticleEngineExamples.js

我试图在javascript中了解所谓的“类”的知识，并且所有“Tween”实例化类似乎都有意义，并且所有“类”都使用“this”指针。但是，我无法实例化两个不同的对象仍然没有意义。我想知道它是否与着色器有关，但这没有意义，因为我可以实例化两种不同类型的粒子，但它似乎是Tween保持不变。

我只是想知道是否有人可以给我一个提示，如果他的代码存在一些问题，导致多个实例无法独特？（我尝试过Fireball和Snow（在演示中）。

任何提示都会很棒。今天花了8个小时，我仍然没有得到它。

这是我使用ParticleEngine.js文件中代码的代码。

// Clouds
var cloud = new Cloud();
cloud.Create(0,0,0, 4, scene);
objects.push(cloud); // this makes the Draw function gets called in each instance

// Sun
var sun = new Sun();
sun.Create(0,200,0, scene);
objects.push(sun); // this makes the Draw function gets called in each instance

// My own classes
// Baseclass
function Object3D() {
    this.mesh;

    Object3D.prototype.GetObject = function() {
        return this.mesh;
    };

    Object3D.prototype.Draw = function() {
        //draw object
    };
}

// Class that creates the snow
function Cloud() {
    Object3D.call(this);

    Cloud.prototype.Create = function(x ,y ,z, s, scene) {
            var engine = new ParticleEngine();
            engine.setValues(
                {positionStyle    : Type.CUBE,
                 positionBase     : new THREE.Vector3( 0, 0, 0 ),
                 positionSpread   : new THREE.Vector3( 200, 0, 200 ),
                 positionRadius : 0.1,

                 velocityStyle    : Type.CUBE,
                 velocityBase     : new THREE.Vector3( 0, -300, 0 ),
                 velocitySpread   : new THREE.Vector3( 150, 20, 150 ),
                 accelerationBase : new THREE.Vector3( 0, -5,0 ),

                 sizeTween    : new Tween( [0, 0.25], [1, 10] ),
                 colorBase   : new THREE.Vector3(0.66, 1.0, 0.9), // H,S,L
                 opacityTween : new Tween( [2, 3], [0.8, 0] ),
                 blendStyle   : THREE.AdditiveBlending,

                 angleBase               : 0,
                 angleSpread             : 720,
                 angleVelocityBase       :  0,
                 angleVelocitySpread     : 60,

                 particleTexture : THREE.ImageUtils.loadTexture( 'textures/snowflake.png' ),

                 particlesPerSecond : Math.random()*50+100,
                 particleDeathAge   : 10.5,
                 // emitterDeathAge    : 60
                });
            engine.initialize();
            this.engine = engine;
    };

    Cloud.prototype.Draw = function(time) {
            this.engine.update(time * 0.00005);
    };
}
Cloud.prototype = new Object3D();
Cloud.prototype.constructor = Cloud;

// Class that creates the fireball effect
function Sun() {
    Object3D.call(this);

    Sun.prototype.Create = function(x, y, z, scene) {
        var sunEngine = new ParticleEngine();

        sunEngine.setValues(
            {
                positionStyle  : Type.SPHERE,
                positionBase   : new THREE.Vector3(0, 200, 0),
                positionRadius : 2,

                sizeTween    : new Tween( [0, 0.4], [1, 150] ),
                opacityTween : new Tween( [0.7, 1], [1, 0] ),
                colorBase    : new THREE.Vector3(0.02, 1, 0.4),
                blendStyle   : THREE.AdditiveBlending,  

                velocityStyle : Type.SPHERE,
                speedBase     : 40,
                speedSpread   : 8,

                particleTexture : THREE.ImageUtils.loadTexture( 'textures/smokeparticle.png' ),

                particlesPerSecond : 60,
                particleDeathAge: 1.5,
                //emitterDeathAge    : 60
            });
        sunEngine.initialize();
        this.sunEngine = sunEngine;
    };


    Sun.prototype.Draw = function(time) {
        this.sunEngine.update(time * 0.00005 );
    };
}
Sun.prototype = new Object3D();
Sun.prototype.constructor = Sun;

在第一个实例（Cloud / Snow）中，我设置了：

sizeTween    : new Tween( [0, 0.25], [1, 10] ),

然后我使用此属性启动“Sun”类：

sizeTween    : new Tween( [0, 0.4], [1, 150] ),

首先启动的云获取与最后添加的云相同的sizeTween值。这是我遇到的核心问题。

奇怪的javascript实例化

0 个答案: