gpt4 book ai didi

javascript - javascript "for"循环问题

转载 作者:行者123 更新时间:2023-11-30 08:35:29 26 4
gpt4 key购买 nike

我有以下代码,它应该将一系列三 Angular 形写入 Canvas 元素,但它似乎只经过一次循环(只有第一个三 Angular 形被写入 Canvas )。我查看了各种类似的问题,但没有成功找到我的问题,希望第二双眼睛能有所帮助。

我在脚本顶部附近定义数组如下:

var array = [0, 0.2, 0.4, 0.6, 0.8];

for (i = 0; i < array.length; i++)
{
ctx.beginPath();
ctx.moveTo(array[i],height);
ctx.lineTo(((width*0.075) + array[i]),0);
ctx.lineTo(((width*0.15 + array[i])),(height));
ctx.closePath();
ctx.fill();
}

谢谢大家的回复。事实证明我放错了括号。 (width * (0.075 + array[i])) 等等是预期的。以下是在大约 210 像素 * 30 像素的 Canvas 上的预期行为。

var array = [0, 0.2, 0.4, 0.6, 0.8];

for (i = 0; i < array.length; i++)
{
ctx.beginPath();
ctx.moveTo(width * array[i], height);
ctx.lineTo(width * (0.075 + array[i]),0);
ctx.lineTo(width * (0.15 + array[i]),(height));
ctx.closePath();
ctx.fill();
}

最佳答案

它实际上确实迭代了 5 次,但它只是在之前的三 Angular 形上绘制了相同的三 Angular 形,因为数组中的值太小了。尝试使用更大的值:

<!DOCTYPE html>
<html>
<body>

<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.</canvas>

<script>

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");

var array = [0,40,80,120,160];
var height = 150;
var width = 300;

for (i = 0; i < array.length; i++)
{
ctx.beginPath();
ctx.moveTo(array[i],height);
ctx.lineTo(((width*0.075) + array[i]),0);
ctx.lineTo(((width*0.15 + array[i])),(height));
ctx.closePath();
ctx.fill();
}

</script>

</body>
</html>

我从 w3schools 中获取了上述代码的基础网站,因为我以前从未使用过 Canvas 。

关于javascript - javascript "for"循环问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31701333/

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