gpt4 book ai didi

javascript - p5.j​​s clear() 函数在移动设备和某些浏览器中无法正常工作

转载 作者:行者123 更新时间:2023-11-30 20:23:23 27 4
gpt4 key购买 nike

我使用的 HTML 非常简单,如下所示:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.6.1/p5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.6.1/addons/p5.sound.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.6.1/addons/p5.dom.min.js"></script>
<script src="sketch.js"></script>
</head>
<body>

</body>
</html>

sketch.js 文件在这里:

function setup() {
createCanvas(500, 500);
}

function draw() {
ellipse(mouseX, mouseY, 20, 20);
}

function mousePressed() {
clear();
}

我完全按照示例中的方式进行操作,但清除仅适用于它的某些部分,而不适用于整个 Canvas 。我在不同的 PC 上尝试了不同的浏览器,有些效果很好,有些则不行。此外,所有移动 Chrome 浏览器都有同样的问题。

下面是它在我的浏览器中的截图: Clearing only a portion of the canvas

最佳答案

看起来这是 p5.js 中影响视网膜屏幕的已知错误 - https://github.com/processing/p5.js/issues/2846

已经有一个修复程序 - https://github.com/processing/p5.js/pull/2852 - 但在撰写本文时尚未发布。

在此期间使用 $("canvas")[0].getContext('2d').clearRect(0,0,width,height); 而不是调用 clear 方法将产生预期的效果。例如:

function setup() {
createCanvas(500, 500);
}

function draw() {
ellipse(mouseX, mouseY, 20, 20);
}

function mousePressed() {
$("canvas")[0].getContext('2d').clearRect(0,0,width,height);
}
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.6.1/p5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.6.1/addons/p5.sound.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.6.1/addons/p5.dom.min.js"></script>

关于javascript - p5.j​​s clear() 函数在移动设备和某些浏览器中无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51209059/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com