控制 Canvas 的创建位置? P5.js
Controlling where Canvas is created? P5.js
我一直在研究 p5 文档,但没有找到任何关于如何控制 canvas 生成位置的示例。
我看到 createCanvas() 有一个可选的渲染器第三个参数,但我不完全确定我应该如何或是否应该实现它。
基本上我拥有的是模态,我想在其中创建 canvas。
标记:
<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 沟通我希望它在我的模态中生成?
您可以使用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
我一直在研究 p5 文档,但没有找到任何关于如何控制 canvas 生成位置的示例。
我看到 createCanvas() 有一个可选的渲染器第三个参数,但我不完全确定我应该如何或是否应该实现它。
基本上我拥有的是模态,我想在其中创建 canvas。
标记:
<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 沟通我希望它在我的模态中生成?
您可以使用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