1

だから私はThree.JS(私の強みではないグラフィックス/アニメーション)で遊んでいて、チュートリアルから適応してこれを思いついた:

これがJSフィドルです

ご覧のとおり、私はほぼ間違いなく3Dアニメーションの天才です。私は逸脱します...

私の質問は、オブジェクトを中心を中心に回転させる方法です。現在のように、四肢についてではありませんか?

私はparticle.rotation.setメソッドを意識していますが、渡す値がわからず、Three.JSのドキュメントでこのメソッドを見つけることができないようです。0周りを見回すと、人々がこれに値を渡し、他の人が派生した値を渡すのを見てきましたMath.PI。要するに、私は自分が何をしているのかわかりません。明らかに、これはmakeParticles関数(以下に表示)で使用する必要があります。

function makeParticles() {

     var particle, material;

     // add random particles from close up to far away
     for ( var zpos= -1000; zpos < 1000; zpos+=20 ) {

       // create particle, setting random colour and calling particle renderer
       material = new THREE.ParticleCanvasMaterial({
         color: '0x'+(function() {
             var ret = '';
             for (var i=0; i<6; i++)
               ret += hex_chars.charAt(Math.floor(Math.random() * hex_chars.length));
             return ret;
         })(),
         program: particleRender
       });

       // make the particle and set positional properties (random X / Y)
       particle = new THREE.Particle(material);
       particle.position.x = Math.random() * 1000 - 500;
       particle.position.y = Math.random() * 1000 - 500;
       particle.position.z = zpos;

       // scale and add to scene
       particle.scale.x = particle.scale.y = 50;
       scene.add( particle );

       // and to the array of particles.
       particles.push(particle);
     }

 }
4

1 に答える 1

0

私はthree.jsにあまり詳しくありませんが、回転ポイントを変更する方法は、particleRender関数を次のように変更することです。

function particleRender(ctx) {
    ctx.beginPath();
    ctx.save();
    ctx.translate(-1,-1);
    ctx.rect(0, 0, 2, 2);
    ctx.fill();
    ctx.restore();
};

ここで推測していますが、パーティクルは(その性質上)three.jsライブラリ内に実際のサイズがないため、それらの座標が回転の中心でもある可能性があります。それらを正しく回転させるには、描画方法を中央に配置する必要があります。

于 2012-08-06T09:52:40.893 に答える