javascript - p5.js'width'变量不起作用？ - Thinbug

p5.js'width'变量不起作用？

时间：2018-02-14 14:53:10

标签： javascript width p5.js

嗨！我正在制作10张PRINT http://10print.org 的副本，跟随Dan Shiffman的（又名YT上的编码列车）处理教程。我采用相同的方法，但在width语句if中使用if (width < posX) {posY = posY + 20;}变量时，posY值未更改。

这是我的代码：

var posX, posY;

function setup() {
	createCanvas(640, 360);
	background(0);
	posX = 0;
	posY = 0;
}

function draw() {
	strokeWeight(2);
	stroke(255);
	if(random(0, 1) > 0.5) {
		line(posX, posY, posX+20, posY+20);
	} else {
		line(posX, posY+20, posX+20, posY);
	}
	posX = posX + 20;
	if (width < posX) {
		posY = posY + 20;
	};
}

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>10 PRINT</title>
    <link href="index.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
    <script src="index.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.6.0/p5.js"></script>
  </body>
</html>

1 个答案:

答案 0 :(得分：0)

当您下到下一行（通过增加posY）时，您可能希望通过重置posX返回到屏幕左侧。像这样：

if (width < posX) {
    posY = posY + 20;
    posX = 0;
};

如果你不这样做，那么posY每帧只会增加20。