processing.js html 设置（关闭）答案

【问题标题】：processing.js html setup (closed)processing.js html 设置（关闭）
【发布时间】：2016-12-16 21:48:49
【问题描述】：

好的。这是我第一次这样做，所以这可能是一个简单的问题。我正在尝试设置一个小程序，在其中定义并在“blobby.js”中创建一个对象，然后在 html 文件的脚本标记中添加setup 和draw。我正在尝试在处理中执行此操作，正如您将看到的，我也在 html 中引用了它。我的问题是即使背景出现了，我在控制台中有一个错误，上面写着random 没有定义。这是我的代码：

<html>
<head>
    <title>PATHOGEN</title>
</head>
<body>
    <script language="javascript" type="text/javascript" src="processing.min.js"></script>
        <script src="blobby.js"></script>
        <script type="text/processing" data-processing-target="mycanvas">
            void setup()
            {
                size(600,600);
                PFont fontA = loadFont("sans-serif");
                textFont(fontA, 14);  
            }
            console.log(cells); 
            void draw(){  
              background(225, 1, 1);
            for (var i = 0; i < cells.length; i++) {
                cells[i].show();
            }
            }
        </script>
    <canvas id="mycanvas"></canvas>
</body>
</html>

另外，这里是 blobby.js 中的代码：

var blobby = function(X, Y, S) {
    this.x = X;
    this.y = Y;
    this.s = S;
};

console.log("Hey, blobby is here!");

blobby.prototype.show = function(){
    //Blobbiness and plasma membrane
    var perlin = 0;
    pushMatrix();
    translate(this.x, this.y);
    strokeWeight(4);
    stroke(20, 210, 60, 170);
    fill(255, 0, 0);
    beginShape();
    for (var a = 0; a < TWO_PI; a+=0.1){ 
        var d = map(noise(perlin, frameCount/100), 0, 1, this.s-10, this.s);
        var x = sin(a)*d;
        var y = cos(a)*d;
        vertex(x, y);
        perlin+=0.1;
    }

    endShape(CLOSE);
    popMatrix();
};

var cells = [];
for (var i = 0; i < 1; i++) {
    cells.push(new blobby(random(100, 500), random(100, 500), random(70, 100)));
}

非常感谢！

【问题讨论】：

标签： javascript html processing.js

【解决方案1】：

在您的情况下，random 是您正在调用的函数，但它未定义 在该文件的任何位置或 index.html 中的脚本标记中。另外我认为您正在尝试执行 Math.random 来获取随机数。因此，如果您只是从 random 更改为 Math.random，您的问题就会得到解决。

【讨论】：

据我所知，随机函数现在正在工作，但不是说 pushMatrix 没有定义。我知道pushMatrix是processing.js中的一个函数，所以我想我的问题可能是我没有设置处理库。我的 html 设置有什么问题吗？
尝试将所有 javascript 代码从 index.html 移动到 blobby.js。
那么由于跨域请求错误，这也可能不起作用。唯一的解决方案是在服务器上运行项目，或者在 forefox 或 safari 中打开项目，这样不会出现跨域请求错误。