在p5.js中创建草图以在鼠标位置放置随机图像
，可以按照以下步骤进行：
- 首先，确保你已经安装了p5.js库，并在HTML文件中引入了相应的库文件。
- 创建一个HTML画布，并在其中引入p5.js的脚本文件。
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>
</head>
<body>
<script src="sketch.js"></script>
</body>
</html>- 在同级目录下创建一个名为"sketch.js"的JavaScript文件，用于编写p5.js的草图代码。
function preload() {
// 在这里预加载你的图像资源
}
function setup() {
createCanvas(800, 600); // 创建一个800x600的画布
}
function draw() {
// 在这里绘制你的草图
// 检测鼠标是否按下
if (mouseIsPressed) {
// 在鼠标位置放置随机图像
var randomImage = getRandomImage(); // 获取随机图像
image(randomImage, mouseX, mouseY); // 在鼠标位置绘制图像
}
}
function getRandomImage() {
// 在这里实现获取随机图像的逻辑
// 可以使用p5.js的loadImage函数加载图像资源
// 返回加载的图像对象
}- 在
preload()函数中，你可以预加载你的图像资源。可以使用p5.js的loadImage()函数加载图像资源，并将其保存在变量中供后续使用。 - 在
setup()函数中，创建一个指定大小的画布，可以根据需要调整画布的大小。 - 在
draw()函数中，你可以编写你的草图逻辑。在这个例子中，我们检测鼠标是否按下，如果按下，则在鼠标位置放置随机图像。 - 在
getRandomImage()函数中，你可以实现获取随机图像的逻辑。可以使用p5.js的loadImage()函数加载图像资源，并返回加载的图像对象。
注意：在实际应用中，你需要准备一些图像资源，并在preload()函数中加载这些资源。你可以使用p5.js提供的图像处理函数对图像进行处理，例如调整大小、裁剪等。
这是一个简单的示例，你可以根据自己的需求进行扩展和修改。关于p5.js的更多信息和详细文档，请参考p5.js官方网站。
相关·内容
我正在设置一个网页，将有3个不同的p5草图的空间。问题是，当我试图将p5草图加载到index.html页面中时，它不能正确加载或正常工作。然而，当我尝试用不包含图像的p5草图做同样的事情时，它工作得很好。 我试过使用<script src= script src="sketch.js"></script>，它适用于不包含图像的p5草图，但对于任何包含图像的草图都不起作用。 <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.js"></s
浏览 30提问于2019-03-29得票数 0
我在我的网站内容后面有一个p5.js素描，作为一个模式。目前，当您执行mousePressed时，形状会再次绘制。我希望将其更改为当您将鼠标悬停在HTML页面上的链接上时发生，而不是当您单击草图时。 有没有办法使用jQuery(或其他东西)，当你将鼠标悬停在链接上时，p5.js草图会发生变化？不确定如何在两个脚本之间通信，也不确定要引用什么 screenshot of the website. i want the p5.js sketch to change when i hover over the HTML links let colors = ["#FAC6E5",
浏览 22提问于2019-04-14得票数 1
我在JSFiddle中编写的这段代码在我的计算机中运行良好，每次按下该按钮，它都会创建一个按钮并加载一个草图。我“加载”了p5.js，p5.dom.js通过CDNJS导致p5.js在javascript框架和扩展选项中不可用。但这种行为并没有得到正确的再现。这是怎么回事？
链接：
我试过：
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.11/p5.js"></script>
<script src="https://cdnjs.cloudflare.com/a
浏览 10提问于2017-07-18得票数 0
回答已采纳
1回答
我正在尝试使用p5.js loadImage(image);加载图像。我正在使用我桌面上的p5库。当我使用浏览器编辑器时，我没有使用浏览器编辑器，它可以很好地处理加载。
但是我得到了两个错误，第一个说
Fetch API cannot load
file:///C:/Users/3worl/OneDrive/Skrivebord/G_O_E/planet.jpg. URL scheme
must be "http" or "https" for CORS request.
第二个人说
p5.js:65680 Uncaught (in promise) Typ
浏览 0提问于2020-11-16得票数 0
1回答
我正在使用类似于的p5.js来模拟绘图机。
我已经创造了相对于电机位置的手臂的位置。我试图重新创建的想法是保持铅笔/钢笔不动，然后用它在下面旋转的画布上画画。我在p5.js编辑器中创建了一个测试。
画两个点，一个是红色，一个是蓝色。目标是使用下面旋转的图形对象上的蓝点创建一个标记或跟踪。
function setup() {
createCanvas(400, 400);
background(255);
img = createGraphics(200, 200);
img.background(150);
浏览 0提问于2019-02-16得票数 2
回答已采纳
2回答
如何在没有超级链接的情况下编程在鼠标单击后移动到新页面？我只想画一个圆，如果你点击这个圆，它会带你到某个地方。我正在使用P5.js
谢谢
浏览 1提问于2017-03-23得票数 0
我正在使用p5js，我试图在我的目录中加载和显示一些图像。我试图在预加载函数中使用loadImage()方法来加载图像。然而，当我运行程序时，我会得到以下错误
Fetch API cannot load file:///Users/mainuser/Documents/school/Senior/FinalProject/imgs/arms_up.png. URL scheme "file" is not supported.
p5.js says: It looks like there was a problem loading your image. Try check
浏览 7提问于2021-11-29得票数 0
回答已采纳
2回答
我正在尝试使用p5.js创建一个div，并让它每小时在屏幕上移动一次，我想知道这是否可能。我还想知道，在p5.js中，这个div是否可以每小时随机更改颜色
浏览 4提问于2015-04-26得票数 0
3回答
以p5.js格式导出视频
、、、
我正在用p5.js创建一个简单的动画程序。当用户单击保存按钮时，我想要下载动画的视频。
我有一个名为frames的对象，其中每个键都被标记为frame_1、frame_2等。与每个关键点关联的值是组成该帧的线段的array。
我正在尝试想一种方法来获取这些数据并创建一个mp4视频。p5.js有一个内置的，我认为它可能会有所帮助，但它本身并不是一个完整的解决方案。我可以将每一帧保存为单独的图像，然后在客户端以某种方式将这些图像拼接在一起，但我还没有找到解决方案。
任何其他的方法也会很好。唯一的要求是它是在客户端完成的。
浏览 2提问于2017-02-24得票数 11
回答已采纳
2回答
我使用p5.js编写了简单的代码，在鼠标按下时在屏幕周围绘制图像。 我注意到创建的图像流并不是真的很平滑，特别是当鼠标移动得更快时，它看起来不像一个统一的画笔，而是许多独立的图像。即使鼠标移动较慢，仍然可以看到所有不同的图片。 有没有可能用p5.js使这种效果更流畅，或者我应该尝试另一种方式来实现这一点？ let image1;
function setup() {
createCanvas(windowWidth, windowHeight);
background(220);
image1 = loadImage('https://upload.wikimedi
浏览 34提问于2021-06-29得票数 1
回答已采纳
1回答
通过创建一个新实例(请参阅javascript文件中的第58行)，我用p5.js创建了两个单独的画布。然后，我插入了一个名为"firstAnimation“的函数，它将显示在其中一个画布中。
在这里运行代码-->
在我的javascript文件p5.js的第45行中，p5.js告诉我我的函数"secondAnimation“不存在。所以我不能在这个画布上输出另一个动画。
在第49行中，我仍然可以用sketch.circle(100,100,100)在第二个画布中画一个圆圈。
如何在第二个画布中显示我的第二个功能，使我有两个动画？
我只能加一个简单的圆圈
浏览 5提问于2022-02-09得票数 0
回答已采纳
1回答
每次点击鼠标时，我都想在画布上画一个随机图像。
let img = []
function preload(){
for (let i = 0; i < 3; i++) {
img[i] = loadImage('img/img' + i + '.png')
}
}
function setup() {
createCanvas(windowWidth, windowHeight)
background(200, 255,255 )
let img = random('img')
}
浏览 0提问于2018-07-08得票数 0
2回答
我对Jekyll非常陌生，我不知道如何创建一个包含p5.js草图的网站，用于我正在进行的项目。
我怀疑这与依赖有关，我非常感谢我能得到的任何帮助/指示！
浏览 0提问于2018-11-12得票数 4
回答已采纳
1回答
Gifs在我的黑色游戏背景上显示不好。所以我单独保存了所有的21帧。把它们放到我的数据文件夹里。现在我需要它们独立地循环，并在鼠标按下命令时停止循环。如何导入所有21个图像的代码行，然后让它们在鼠标被按下时循环和停止？
浏览 1提问于2014-12-23得票数 0
2回答
带有椭圆的p5.js画布绘图路径
、、、、
我正在使用socket.io、node.js和p5.js开发一个实时画布绘图and应用程序。当鼠标被拖动时，我很难创建一条平滑的线。如果鼠标拖得太快，每个椭圆之间就会有一条空隙。这里的最终目标是创建一条平坦的道路。以下是我到目前为止尝试过的一些事情：
尝试1：
noStroke();
fill(lineColor[0],lineColor[1],lineColor[2]);
ellipse(mouseX, mouseY, lineThickness, lineThickness);
企图2：
strokeWeight(lineThickness);
line(mouseX,mouseY);
s
浏览 8提问于2017-07-27得票数 2
回答已采纳
1回答
同一页面中的多个p5.js画布
、、、、
虽然我有一些处理经验，但我对p5.js还是个新手。对于一个学术作品，我想创建一个具有多种互动体验的网站。我希望这个网站是一个单一的页面，没有链接，什么都没有，只是一个单一的卷轴。 为此，我希望沿着长卷轴有多个画布。我还希望当用户在滚动的正确位置时，这些交互式体验才会开始。我可以为我的问题想出多种解决方案，但我不确定如何实现它们，也不确定哪一个是最好的。 用一个页面就可以做到这一点吗？是否可以将画布放到div中，然后使用css按顺序显示它？ 我想到的另一个解决方案是创建多个页面，但这只是一个使用某种动画来模拟滚动的页面，这个方法可以保证用户总是全屏查看画布，但我不确定他是否能用普通的滚动条来控
浏览 61提问于2020-12-05得票数 2
回答已采纳
1回答
最近，我试图修改的源代码。这种交互式程序的底层技术称为草图-rnn，一种可以生成草图的深度学习算法。我需要访问画布上的实时图像，以便我可以使用卷积神经网络(CNN)，并将图像作为一个二维阵列提供给神经网络，以便进一步改进程序。有什么p5.js函数可以帮助我实现这一点吗？
浏览 5提问于2019-09-25得票数 1
回答已采纳
1回答
在这里，我使用随机x和y动态地移动图像，在缩放和拖动SVG中。现在，我想在这些移动图像后面附加虚线路径。类似于下面的图像：
我找到了一个，在这里，鼠标后面有一条虚线路径。目前，我尝试使用相同的代码为一个图像创建路径。我没有使用鼠标X&Y坐标，而是使用了运动图像的随机X和Y值。
var pt = [];
pt.push(randomX);pt.push(randomY);
tick(pt);
function tick(pt) {
// push a new data point onto the back
ptdata.push(pt);
// Redraw
浏览 3提问于2017-02-16得票数 1
回答已采纳
我有一个网页，里面有一些草图，都是用P5.JS写的
每个草图都使用自己的名称空间，这样它就可以独立地运行。
我注意到，对于每一个草图，性能水平都比我在单独的网页中单独运行时得到的要低。
我的问题是:我能做些什么来阻止所有的草图同时运行？例如，只有当鼠标悬停在画布上时，才能激活草图吗？它可能会腾出资源。
谢谢你的帮助。
浏览 2提问于2021-08-21得票数 1
回答已采纳
1回答
我最近尝试进入p5.js，在我正在从事的第一个项目中，我正经历着一个完全不正常的问题，无论出于什么原因，我在网上找不到任何其他地方。
我在setup()之外定义的任何变量都是未定义的，但这是众所周知的事实。问题是，我在setup()中定义的任何变量也将是未定义的，这意味着我根本不能使用任何变量。
以下是代码：
function setup() {
const canvasRatio = 0.975;
createCanvas(int(windowWidth*canvasRatio), int(windowHeight*canvasRatio));
fill(0);
stroke
浏览 3提问于2017-04-07得票数 0
回答已采纳
2回答
我正在尝试创建一个代码，其中一个笑脸是随机绘制在屏幕上和一个随机的颜色，这应该循环，但我不知道如何最好地使用随机()函数来实现这一点。有人能给我指点吗？我已经尝试过使用变量(var在绘制函数中调用函数smileyFace )，但没有成功！
代码：
function setup() {
createCanvas(400, 400);
background(220);
smileyFace(random(0, 400), random(0, 400));
}
function draw() {
}
function smileyFace(x, y) {
fill(250)
浏览 3提问于2019-10-04得票数 2
回答已采纳
因此，我目前正在为p5.js做一个草图，它将两个随机图像放置在用户在画布上单击的位置。这个想法是在用户选择点击的任何位置创建一个具有随机化头部和随机化身体的角色的“纸娃娃”。所讨论的随机图像是头部图像和身体图像。我决定用数字命名图像，这样我就可以使用字符串插值来用图像名称中的数字随机化图像。
我已经成功地在没有图像随机化的情况下展示了纸玩偶，但我现在似乎无法在鼠标单击时成功地随机化两个不同的图像。如何使用这种字符串插值技术随机化显示的图像？
let body = [];
let head = [];
let characters = [];
function preload() {
fo
浏览 25提问于2020-11-14得票数 0
3回答
我在为一家公司建一个搞笑小网站。他们想要一种功能，当用户将鼠标光标悬停在某个图像上时，鼠标光标将随机改变位置。
这在Javascript中是可能的吗？我该如何实现它？
谢谢!
浏览 0提问于2011-01-26得票数 7
回答已采纳
1回答
我有一个带有幻灯片控件的精灵图像。
当用户将鼠标悬停在控件上时，我想更改每个控件的背景位置，以便它看起来是活动的。
我正在使用：
-moz-transition: background-position 0.45s linear;
-webkit-transition: background-position 0.45s linear;
-o-transition: background-position 0.45s linear;
我的代码是用编写的( bg图像显然不是我的控件，而是一个随机图像)。
我希望过渡效果是当鼠标悬停在一个项目上(可能是淡入淡出)时所期望的效果，而不是当前看起来像b
浏览 2提问于2012-12-07得票数 1
回答已采纳
1回答
我试着根据我的鼠标位置，在圆的边缘内，根据三角函数找到x，y坐标。 ? 正如你可以从gif图像中看到的，当你的鼠标移动时，三角形的尖端总是指向圆的边缘，而我的鼠标在椭圆周围移动。 我正在使用P5.js，我希望知道如何编写这篇文章，如果你能带我了解一下背后的三角学，我会很感激，这样我就可以利用这些知识，尝试更多类型的可视化编程想法。
浏览 23提问于2020-09-22得票数 3
回答已采纳
1回答
我试图在同一个页面上创建一个包含多个p5画布的网站，因此经过大量的研究，我得出的结论是，最合适的方法是在p5上使用实例模式。我花了一整天的时间来理解实例模式，我甚至在网上找到了一个转换器，它可以为我转换它，但我试图用它来检查错误。问题是，我找不到一种方法来使用声音在我的草图使用实例模式。我所拥有的代码要复杂得多，但即使只是尝试基本的代码，它仍然无法工作。
var s = function(p) {
let song;
p.preload = function() {
p.song = load('thunder.mp3')
}
p.setup
浏览 5提问于2020-12-06得票数 0
回答已采纳
2回答
我正在编写一个p5.js游戏，我必须在我的画布上绘制一个按钮，一个输入和一个p元素。我想让所有这些元素相对于画布居中。
我尝试了这个解决方案，但没有成功：
var gameCanvas = createCanvas(600, 600);
gameCanvas.parent("game-container");
input = createInput();
input.position(280, 300);
input.parent("game-container");
我有一个带有游戏创造者id的div，这项工作直到我通过css将div居中。当我将div居
浏览 0提问于2016-12-18得票数 0
我已经用p5.js制作了一个草图，用户可以通过创建形状、在屏幕上拖动它们以及控制滑块等方式进行操作。我想知道是否有一种方法可以将形状的x和y坐标，它们的高度和宽度，以及滚动条的位置插入到MySQL的数据库中，这样我就可以制作一个功能齐全的网站，用户可以在其中创建、保存和修改草图。
我尝试过使用JSON文件，但我意识到我不能使用p5.js修改JSON文件，因此用户将无法修改他们的草图并保存更改。我也在网上搜索了这个问题的解决方案，但似乎什么都没有出现。
浏览 1提问于2019-07-22得票数 0
我在处理过程中编写了一个草图，创建了3个节点，用户可以在其中单击以显示下拉列表。是否有办法使下拉列表消失在，比如说，外部鼠标或释放鼠标按钮上？我想我只需要在绘图部分调用背景，它就会覆盖列表，但情况似乎并非如此，因为它们实际上并不是绘图的一部分。谢谢!
浏览 4提问于2014-07-26得票数 0
回答已采纳
我正在跟踪并了解库。在这个特别的练习中，我想使用潜在的大整数，所以我环顾四周，发现了。
我试图以p5.js库本身的方式在我的项目中包含这个脚本，就像BigInteger的自述文件中所建议的那样：
<script src="http://peterolson.github.com/BigInteger.js/BigInteger.min.js"></script>
然而，在这样做之后，当我尝试从我的bigInt is not defined引用它时，我仍然会得到它的错误。
有人能帮我理解我错过了什么吗？您可以在p5.js web编辑器中看到我的项目
浏览 2提问于2018-09-30得票数 2
回答已采纳
1回答
我做了自己的图像过滤器。当鼠标单击原始(左)图像时，它意味着在处理的(右)图像上创建径向模糊效果。但是，经过测试，我发现只有当我的鼠标在图片上加载时，它才能工作。然后，如果我点击我的鼠标，原始图片将被处理，看起来过滤器在已经处理过的图像上变得更强了，就像它得到了另一个应用在上面的过滤器。我点击的次数越多，这种情况就会继续。有人知道我做错了什么吗？我不知道我的代码的问题在哪里。
var img;
function preload() {
img = loadImage("https://media.makeameme.org/created/doesnt-know-why-gx
浏览 1提问于2022-03-09得票数 0
回答已采纳
1回答
我的网页上有一个p5.js画布，我想把这个画布作为链接中的图像，就像一个原始媒体文件托管在网站上一样，这样我就可以把它作为一个普通的get媒体链接使用，不知道技术术语是什么。
这是可能的，还是我必须先在本地下载映像，然后从驱动器中使用它？
浏览 1提问于2021-04-05得票数 1
回答已采纳
https://editor.p5js.org/psb_david_petty/full/gblbwpq7g?m=MSG p5.js对他们的共享链接做了什么(重定向还是什么？)这样URLSearchParams就不能再检索参数了？此代码始终返回null let uri = new URL(window.location.href);
let msg = uri.searchParams.get('m'); p5.js最近开始在共享链接的顶部包含一个红色的p5*横幅，URI搜索参数不再可读。我已经在net和stackoverflow上寻找答案了，我已经在四个不同的浏览器
浏览 28提问于2021-11-20得票数 0
1回答
我正在用p5.js制作一个在线游戏，我想手动调用安装程序，一旦安装程序被调用，我就想运行draw()。
例如，如果我单击一个按钮：
<button id="somebutton" onclick="setup()">CLICK ME!!!</button>
然后，画布将被创建，安装程序中的所有内容都将运行，并将运行draw()。
浏览 4提问于2016-09-26得票数 6
回答已采纳
2回答
我是P5.js/processing (为艺术家编程)的新手。我正在尝试制作一个粗糙的游戏，其中一个图像(Jar Jar)在屏幕上反弹，另一个图像(光剑)随着鼠标移动，当鼠标连接的图像经过弹跳的图像时，光剑将被镜像并激活声音。如果这一切都有意义的话...
到目前为止，我已经关闭了弹跳图像部分，但我无法使mousePressed()函数工作。就像我提到的，当鼠标被按下时，我需要"lightsaber.png“翻转。此外，当鼠标被按下并直接位于JarJar图像上时，我如何添加分数计数和声音事件？
谢谢!到目前为止，我的代码如下：
let jarJar;
let jarJarX=5;
let
浏览 6提问于2021-02-09得票数 0
2回答
我刚开始学习p5.js，我有一个随机颜色的问题。现在，我看到，只有当我重新启动代码时，颜色才会被随机重置。但是，当鼠标被按下时，是否有可能做到这一点呢？
这是我的代码：
let r, g, b;
function setup() {
createCanvas(400, 400);
r = random(255);
g = random(255);
b = random(255);
}
function draw() {
if (mouseIsPressed) {
fill(r,g,b);
} else {
fill(255);
}
el
浏览 9提问于2022-05-21得票数 3
1回答
好的，我想要一个有两个按钮的网页。当单击这些按钮时，每个按钮都会创建一个新画布，并调用不同的绘制函数。第一个绘图函数将绘制用户鼠标所在的大圆圈和按下鼠标时的小圆圈。另一个绘图函数做同样的事情，除了鼠标未按压时的小圆圈和鼠标未按压时的大圆圈。我没有问题，引用其中之一与按钮，但另一个按钮似乎没有调用它的绘制功能。is看起来工作得很好，但是似乎没有调用sketch.js中的绘图函数。任何关于我应该如何解决这个问题的建议都是非常感谢的！
下面是我的HTML代码：
<html>
<head>
<meta charset="UTF-8">
&
浏览 1提问于2015-11-05得票数 0
回答已采纳
1回答
我正在使用jQuery工具提示为图像地图创建html工具提示。但是，当鼠标悬停时，工具提示将显示在整个图像的下方。我希望工具提示出现在area元素的旁边。我该如何做到这一点呢？谢谢。
jQuery：
$("#trigger1").tooltip({
items: "area",
content: "<div class='tooltipContent'><h3>1896</h3><p>Bemidji became a town</p></div>&#
浏览 9提问于2014-04-18得票数 0
我需要用p5.js编写一个脚本，以设定的时间间隔(例如20ms)跟踪五个指尖(一只手或两只手)的位置，然后将时间手指数据保存到.csv中
我以前在处理表格和获取手指的PVector中做过这件事，但是我不知道如何用javascript来做这件事。
任何和所有的意见都将非常感谢！
浏览 12提问于2018-02-03得票数 1
1回答
所以，我试图在我的网站上加入一个绘图页面，P5.js可能是我知道的最简单的方法，因为它类似于Processing.js，我从可汗学院学到了这一点。但出于某种原因，画布没有出现，问题是，没有错误信息，而且，它在P5.js网站编辑器上工作。
诚然，除了将代码复制粘贴到脚本标记之外，我还没有尝试过更多的方法，所以这可能是非常明显的。以下是脚本标记：
<script src="lib/p5.js">
function setup() {
createCanvas(400, 400);
background(255, 255, 255);
no
浏览 1提问于2021-09-27得票数 1
回答已采纳
1回答
在p5.js中，我正在通过鼠标学习用户输入，我想在4次不同的点击中创建一个正方形的4行方法，每一行点击1次，最后一次点击完成这个方块。下面的代码是2行代码，但这两行代码同时运行，我无法理解if命令来单独运行它们。
function setup() {
createCanvas(400, 400);
background(220);
}
function draw() {
}
function mousePressed()
{
line(width/20,height/40,mouseX,mouseY);
line(pmouseX,pmouseY,mo
浏览 5提问于2019-11-21得票数 0
回答已采纳
3回答
我非常喜欢p5.js和react.js，所以我想知道如何将这两者结合在一起，而且我无法做到这一点，所以我需要您的帮助。我不能为您提供一些代码示例，因为我不知道如何开始。
所以我想要做的是: 1.创建-react app 2.使用p5.js呈现一个画布(我不需要p5.dom和p5.Music)
浏览 0提问于2019-02-25得票数 9
2回答
我正在试着根据光标移动的方向旋转图片。下面是我为tring编写的一些代码： <head>
<meta charset="UTF-8">
<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.min.js"></script>
<!-- uncomment
浏览 21提问于2019-04-29得票数 0
1回答
我只是试图获得我的音频水平，并绘制一些效果，对于这个基本的例子，只是一个椭圆，但我不能让它工作。以下是代码文件： var mic;
function setup() {
createCanvas(200, 200);
mic = new p5.AudioIn();
mic.start();
}
function draw() {
background(0);
var vol = mic.getLevel();
ellipse(100, 100, vol * 200, vol * 200);
}
function touchStarted() {
getA
浏览 55提问于2021-06-30得票数 0
回答已采纳
在p5.js中，我试图创建一个动画，当鼠标按下时，线条的底点(每帧5px)平滑地移动到画布的左下角。我可以使用lines.align让它们达到需要的程度，但它们会立即移动到那里，而不是动画。
let lines = []
function setup() {
createCanvas(600, 400);
for(let i = 0; i < 150; i++) {
lines[i] = new Line(random(600), 0, random(600), 400, random(149,212), random(8
浏览 4提问于2018-05-14得票数 2
3回答
我使用原子编辑器。我想用我的画布制作20秒GIF。saveFrames()有一个限制(我猜)。它允许将.png文件保存到短的gifs(3-5秒)，即使我输入了saveFrames("aa","png",15,22);。
我发现了CCapture.js，但找不到任何代码示例来导出画布。
它不需要作为GIF导出；但我至少要在画布中保存我的动画的.png快照。我该怎么做呢？
我在p5.js中的动画代码：
var x = 0;
var speed = 10;
var d1 = 100;
var d2 = 100;
function setup() {
crea
浏览 2提问于2018-07-08得票数 11
1回答
我正在制作一个用javascript编写的Monopoly风格的游戏(使用p5.js库)。我试图创建一个卡的动画，使用rect，滑动在一个固定的宽度和高度的2d对象之上。下面是我的三个功能，显示我的思维过程：
card_property.js:
function PropertyCard(posX, posY, width, height, property){
this.width = width;
this.height = height;
this.posX = posX;
this.posY = posY;
this.property = property;
浏览 3提问于2017-03-15得票数 2
我正在为p5.js开发一个插件库，我需要在某些函数中设置几个填充/笔画颜色。
是否有一种方法可以得到当前的填充/笔画值，这样我就可以确保当用户调用上述函数时，他不必担心我设置的颜色？
这类东西：
function foo(){
var tempColor = getFill(); //Hypothetical get color function
// ...
fill(color1); //Some color I use
// ...
fill(color2); //Another c
浏览 7提问于2018-01-09得票数 7
回答已采纳
我想让我的背景移动到鼠标光标所在的位置，就像这样。
由于鼠标光标位于左上角，背景图片应向下右转。
由于鼠标光标位于右上角，背景图片应向下左转。
当鼠标光标位于左侧时，背景图片应转到右侧。
背景照片应该是无限的，可以用x和y大小填充整个画布。我怎样才能用p5.js做到这一点呢？
浏览 6提问于2017-03-08得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
