处理js不循环绘制函数

时间:2016-12-29 00:18:34

标签: wordpress processing processing.js

我正在尝试使用processing.js将处理草图插入我的wordpress博客。

问题是我得到的是冻结的图像而不是移动的图像。就好像绘制函数没有循环一样。 (在我的电脑上草图工作正常)

可能是什么原因造成的?我该如何解决?

<script type="text/processing" data-processing-target="MySketch">
ball[] balls;
int numBalls = 20;
void setup(){
size (300,300,P3D);
background(255);balls=new ball[numBalls];
for(int i=0; i<numBalls;i++){
  float r=random(5,20);
 balls[i] = new ball(random(r,width-r),random(r,height-r),0,r,random(-1,10),random(-1,10));
}

}

    void draw(){
     background(255);
     for(int i=0; i<numBalls;i++){ 
ball b; b=balls[i]; 
b.drawBall(); 
b.moveBall(); 
b.boundaries(); 
} 
} 
class ball{ 
float x;
 float y;
 float z;
 float r;
 float vx;
 float vy;
 ball(float x1,float y1,float z1,float r1,float vx1,float vy1 ){
 x=x1; 
y=y1; 
z=z1; 
r=r1; 
vx=vx1; 
vy=vy1; 
} 
void drawBall(){
 noStroke(); 
fill(255,0,0);
 lights(); 
pushMatrix(); 
translate(x, y,z);
 sphere(r); 
popMatrix(); 
} 
void moveBall(){ 
x=x+vx;
 y=y+vy; 
} 
void boundaries(){
 if(x>=width-r || x<0+r) 
vx=vx*-1; 

if(y>=height-r || y<0+r)
      vy=vy*-1;
     }
    }
    </script>
    <canvas id="MySketch"></canvas>

1 个答案:

答案 0 :(得分:0)

您的第一站应该是JavaScript控制台。您将收到的任何错误都会显示出来。在大多数浏览器中,您只需按下F12键,或在菜单中的开发人员设置中找到它。

当我运行您的代码并查看JavaScript浏览器时,我发现此错误:Uncaught can only create 8 lights

我从错误中收集到的是浏览器只能处理8个灯光,但您正在尝试创建更多灯光。它可以在您的PC上正常工作,因为您可能使用的Java模式没有相同的限制。

如果是这样的话,你唯一能做的就是减少你正在画的灯光数量。