1

そこで、ここで問題と思われるものを特定しました。ただし、なぜ正確に console.log(particles[index].x); なのか理解するのに苦労しています。呼び出しは「NaN」を出力します。数値である必要があります。それで、なぜそうではないのですか？これが反対票に値する理由がわからない、誰かが私にこれを説明できますか?

<html>
<head>
</head>
<body>
<canvas id='c'></canvas>
<script type="text/javascript">
var width = window.innerWidth,
height = window.innerHeight,
c = document.getElementById('c'),
ctx = c.getContext('2d');
c.width = width;
c.height = height;
var center = {x:width/2, y:height/2};


var particles = [];
var totalParticles = width/50;
var size = 20;

function init(){
    for (var i = 0; i < totalParticles; i++) {
        addParticle(i);
    }
    drawParticle(center.x, center.y, 20, particles[1].c);

    setInterval(update, 40);
}

function update(){

    for (var i = 0; i < particles.length; i++) {
        applyForce(i);
    }
}

function applyForce(index){

    console.log(particles[index].x);
    var rx = Math.abs(particles[index].x - center.x);
    var ry = Math.abs(particles[index].y - center.y);

    var sign = {x:1, y:1};
    if (particles[index].x > center.x) {
        sign.x = -sign.x;
    } else {
        sign.x = sign.x;
    }

    if (particles[index].y > center.y) {
        sign.y = -sign.y;
    } else {
        sign.y = sign.y;
    }   

    //just use size for mass, center has mass 1
    var force = {
        x:(sign.x*particles[index].s)/Math.pow(rx, 2),
        y:(sign.y*particles[index].s)/Math.pow(ry, 2)
    };



    addForce(index, force);

}

function addForce(index, force){

    particles[index].v.x += force.x;
    particles[index].v.y += force.y;

    particles[index].x = particles[index].x + particles[index].v.x;
    particles[index].y = particles[index].y + particles[index].v.y;

    drawParticle(particles[index].x, particles[index].y, particles[index].s, particles[index].c);

}

function drawParticle(x,y,size,color){

    ctx.beginPath();
    ctx.arc(x, y, size, 0, Math.PI*2, true);
    ctx.closePath();
    ctx.fillStyle=color;
    ctx.fill();
}

function addParticle(index){

        size = Math.random() * size + 10;
        var y = Math.random() * height;
        var x = width - 10;
        if (index%2) {
            x = 10;
            console.log("even");
        }

        particles.push({s:size, 
                        x:x, 
                        y:y, 
                        v:(Math.random() * 2) + 4, 
                        c:'#' + (Math.random() * 0x313131 + 0xaaaaaa | 0).toString(16)});

        return;

}

init();

</script>
</body>
</html>
4

2 に答える 2

2

particles[index].v.xとparticles[index].v.yは常に のようですundefined。したがって、これらのundefined値を合計すると、次のようになります。

particles[index].x = particles[index].x + particles[index].v.x;
particles[index].y = particles[index].y + particles[index].v.y;

particles[index].xそしてparticles[index].yまたなるundefined。

于 2013-01-23T23:04:34.810 に答える
0

v プロパティに数値を割り当てます...

particles.push({s:size, 
                x:x, 
                y:y, 
                v:(Math.random() * 2) + 4, 
                c:'#' + (Math.random() * 0x313131 + 0xaaaaaa | 0).toString(16)});

後でこのようにアクセスします...

 particles[index].v.x += force.x;
 particles[index].v.y += force.y;

vx と vy は両方とも未定義です。

> 1 + undefined
Nan

数値と undefined は数値ではありません。

于 2013-01-23T23:19:07.887 に答える