我尝试将 p5.js 中的 gif 添加到我的“艺术品”(基本上是带有移动元素的图片)。
但是,我遇到了错误“Uncaught TypeError: gifimage.position is not a function”,即使我认为我是按照不同指南中的指示进行的。
我试过这个:https://editor.p5js.org/kjhollen/sketches/S1bVzeF8Z
下面是代码(……代表不影响错误的部分)。
var gifimage;
function preload() {
.........
gifimage = createImage("gifimage.gif");
}
function setup() {
createCanvas(1920, 1080);
}
function draw() {
.........
if (keyIsPressed === true) {
gifimage.position(500, 800);
}
}
最佳答案
位置不是 p5.js Image 的函数。为了使用位置,您需要使用 createImg 创建一个 img dom 元素。
这里我修改了这个sketch演示如何通过按键更改 img
的位置。
var gif_createImg;
function preload() {
gif_createImg = createImg("vegetables.gif");
}
function setup() {
createCanvas(500, 700);
background(0);
}
function draw() {
background(0);
// updates animation frames by using an html
// img element, positioning it over top of
// the canvas.
if (keyIsPressed){
gif_createImg.position(50, 50);
} else {
gif_createImg.position(100,100);
}
}
要使用 dom 函数,您需要包含 p5.js 库和 p5.dom.js 插件。
<script src='https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.8.0/p5.min.js'></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.6/addons/p5.dom.js"></script>
关于javascript - 将 gif 添加到 p5.js "artwork",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56018372/