processing.js html設置（關閉）

好的。這是我第一次這樣做，所以這可能是一個簡單的問題。我試圖設置一個小程序，在該程序中，我在「blobby.js」中定義並創建了一個對象，然後在html文件的腳本標記內部有setup和draw。我正在嘗試在處理中執行此操作，我將在HTML中引用該操作，正如您將看到的那樣。我的問題是，即使背景顯示，我在控制檯中有一個錯誤，說random未定義。這裏是我的代碼：processing.js html設置（關閉）

<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))); 
}

非常感謝！

來源

2016-12-16 Caleb Bertrand

在你的情況隨機是，你調用一個函數，但它在該文件或存在於您的index.html腳本標籤沒有被定義任何地方。另外我認爲你正在嘗試做Math.random來獲得一個隨機數。所以如果你只是從隨機改爲Math.random，你的問題就解決了。

來源

2016-12-16 21:58:50

據我所知，隨機函數現在正在工作，但不是它說pushMatrix沒有定義。我知道[pushMatrix]（http://processingjs.org/reference/pushMatrix_/）是processing.js中的一個函數，所以我認爲我的問題可能是我沒有設置處理庫。我如何設置我的html有什麼問題嗎？ –

嘗試將您的index.html中的所有JavaScript代碼移動到blobby.js中。 –

然後，由於交叉源請求錯誤，這也可能不起作用。唯一的解決方案是在服務器上運行項目，或者在forefox或safari中打開項目，以免發生跨源請求錯誤。 –

processing.js html設置（關閉）

回答

相關問題