0

我不明白为什么这个处理草图在某些浏览器中不起作用。它适用于 Firefox，但无法在 Safari 和 Chrome 中运行。

我将代码放在我网站上的脚本标记中，并按照处理网站http://processingjs.org/articles/PomaxGuide.html上的建议定位“画布” 。起初，草图似乎工作正常。但是一旦我尝试使用其他浏览器，我就遇到了麻烦。在 Safari 中它根本不会加载。

这似乎是一个相对简单的草图，所以我真的不确定问题出在哪里......

这是草图：

float b = 4;
float c = 8;

int x = 10;
int k = 3;
int f = 1;

  void setup() {
    size(755, 685, P3D);
    fill(190);
  }

  void draw() {
    background(0, 102, 102);
    translate(width/2, height/2);

    strokeWeight(2);
    noFill();
    rect(-width/2, -height/2, 755, 685);
    rect((-width/2) + 7, (-height/2) + 7, 741, 671);

    noStroke();
    fill(255, 204, 51);
    rect((-width/2) + 40, -height/2, 20, 7);
    rect((-width/2) + 120, -height/2, 20, 7);
    rect((-width/2) + 200, -height/2, 20, 7);
    rect((-width/2) + 280, -height/2, 20, 7);
    rect((-width/2) + 360, -height/2, 20, 7);
    rect((-width/2) + 440, -height/2, 20, 7);
    rect((-width/2) + 520, -height/2, 20, 7);
    rect((-width/2) + 600, -height/2, 20, 7);
    rect((-width/2) + 680, -height/2, 20, 7);
    rect((-width/2) + 40, (-height/2) + 678, 20, 7);
    rect((-width/2) + 120, (-height/2) + 678, 20, 7);
    rect((-width/2) + 200, (-height/2) + 678, 20, 7);
    rect((-width/2) + 280, (-height/2) + 678, 20, 7);
    rect((-width/2) + 360, (-height/2) + 678, 20, 7);
    rect((-width/2) + 440, (-height/2) + 678, 20, 7);
    rect((-width/2) + 520, (-height/2) + 678, 20, 7);
    rect((-width/2) + 600, (-height/2) + 678, 20, 7);
    rect((-width/2) + 680, (-height/2) + 678, 20, 7);
    rect(-width/2, (-height/2) + 45, 7, 20);
    rect(-width/2, (-height/2) + 127, 7, 20);
    rect(-width/2, (-height/2) + 209, 7, 20);
    rect(-width/2, (-height/2) + 291, 7, 20);
    rect(-width/2, (-height/2) + 373, 7, 20);
    rect(-width/2, (-height/2) + 445, 7, 20);
    rect(-width/2, (-height/2) + 527, 7, 20);
    rect(-width/2, (-height/2) + 609, 7, 20);
    rect((-width/2) + 748, (-height/2) + 45, 7, 20);
    rect((-width/2) + 748, (-height/2) + 127, 7, 20);
    rect((-width/2) + 748, (-height/2) + 209, 7, 20);
    rect((-width/2) + 748, (-height/2) + 291, 7, 20);
    rect((-width/2) + 748, (-height/2) + 373, 7, 20);
    rect((-width/2) + 748, (-height/2) + 445, 7, 20);
    rect((-width/2) + 748, (-height/2) + 527, 7, 20);
    rect((-width/2) + 748, (-height/2) + 609, 7, 20);


    rotateY(map(mouseX, 0, width, -PI, PI));
    //rotateX(map(mouseY, 0, height, -PI, PI));
    rotateZ(map(mouseY, 0, height, -PI, PI));
    //rotateX(PI/4);
    //rotateZ(1);


    scale(25);
    stroke(255, 204, 51);

    strokeWeight(1);
    line(-width/2, 0, width/2, 0);
    line(0, -height/2, 0, height/2);

    strokeWeight(5);
    point(1 + f + b, -12 + k + b, 3 + x + b);
    point(1 + f + b, -13 + k + b, 3 + x + b);
    point(-4 + f + b, -12 + k + b, -1 + x + b);
    point(4 + f + c, -12 + k + c, 4 + x + c);
    point(2 + f + c, -9 + k + c, 1 + x + c);

  }

知道为什么吗？

4

2 回答 2

0

我在 chrome 中遇到了同样的问题，它不能离线工作，但它可以在线工作（不知道为什么），在 safari 中你需要去 safari/preferences/advanced 并激活开发菜单。拥有它后，您可以在其中激活 WebGL，这样应该可以解决问题。

PS：对不起，如果菜单中的单词不完全相同，我有西班牙语...

于 2013-08-09T15:59:07.520 回答
0

到目前为止，在所有浏览器中对我来说都很好。如果你把它放在小提琴里，

<script type="text/processing">
  // ...your code here
</script><canvas></canvas>

像这里一样，http://jsfiddle.net/7RGHL，并在你的各种浏览器中加载它，它们应该都可以工作。由于您没有包含用于使其在页面上运行的 HTML 代码，因此无法说出您做错了什么，但至少您的处理代码没问题。

于 2013-05-01T22:11:16.097 回答