p5.j​​s createCanvas 未定義錯誤。 未捕獲的引用錯誤

Question

問題：

我正在嘗試在我的簡單應用程序中使用p5.j​​s ，並將其包含在內：

<script src="static/js/p5.js"> </script>

我試過的：

如果我放一個調試器並查看控制台，我會得到p5Color （例如）和其他的函數。 並且腳本可以很好地加載到頁面上。 除了createCanvas不會自動完成並且在頁面中使用時，會引發上述錯誤。

為什么？ 我該如何解決這個問題？

Answer 1

p5.j​​s 不會加載到“全局模式”，除非它看到頁面上定義的setup()或draw() 。

選項 1 - 強制全局模式。 （請注意，如果您這樣做， createCanvas()在控制台中不會有多大createCanvas() ，因為setup()已經在頁面加載時運行了。）

<script src="static/js/p5.js"> </script>
<script>
    function setup() {
        //...
    }
</script>

選項 2 - 使用實例模式。 （如果你真的想從控制台使用 p5.js，這可能是你最好的選擇。）

var s = function( sketch ) {
  sketch.setup = function() {
    sketch.createCanvas(700, 410);
    //...
  };
};    
var myp5 = new p5(s);