控制在哪里創建Canvas？ P5.js

Question

我一直在探索p5文檔，但沒有找到有關如何控制畫布制作位置的任何示例。

我看到createCanvas（）對於渲染器有一個可選的第3個參數，但是我不確定如何實現或該實現。

本質上，我擁有的是模態，並且我想在其中創建畫布。

標記：

<div>
    <div class="IX_recordControls clearfix">
        <div class="rcrow canvas">Woof</div> <-- //Let's say I want my canvas here.
    </div>
</div>

在我的JS文件中，我在setup（）中調用createCanvas（），如下所示：

function setup(){
    createCanvas(400, 150)
    $s.p5mic = new p5.AudioIn()
    $s.p5mic.start()
    $s.micIsOn = true
       background(155);
       draw();
       noLoop();
    }

我該如何與我希望在模態內部生成的createCanvas通信？

Answer 1

您可以使用p5.Element.parent()函數。

<div id="sketch-holder">
  <!-- Our sketch will go here! -->
</div>
...

var canvas = createCanvas(100, 100);

// Move the canvas so it’s inside our <div id="sketch-holder">.
canvas.parent('sketch-holder');

資料來源： GitHub