Почему цвета не перестают меняться в p5js?

89
02 декабря 2021, 01:20

function Randpaint(){ 
	var Rcolor = color(random(255),random(255),random(255)); 
	fill(Rcolor) 
	 noStroke(); 
} 
function RandDraw(rowNum, colNum){ 
  noStroke(); 
  var stepX; 
  var stepY; 
  stepX = width/rowNum; 
  stepY = height/colNum; 
  for (var i = 0; i < colNum; i++) { 
    for (var j = 0; j < rowNum; j++) { 
      Randpaint() 
      rect(i * stepX, j * stepY, stepX, stepY); 
    } 
   } 
} 
function setup() { 
  createCanvas(500, 500);  
}   
 
function draw(){ 
	background(255); 
    rectMode(CORNER); 
    RandDraw(3, 3)	 
}
</!DOCTYPE html> 
<html> 
<head> 
	<script src="https://cdn.jsdelivr.net/npm/p5@0.10.2/lib/p5.js"></script> 
	<script type="text/javascript" src="script.js"></script> 
	<title></title> 
</head> 
<body> 
	 
</body> 
</html>

P.S нужно, чтобы у квадрата был постоянный цвет

Answer 1

Вот примерно так можно сгенерировать необходимое кол-во цветов один раз, а не каждый кадр:

let colors = []; 
 
function Randpaint(i){ 
  if (!colors[i]) 
    colors[i] = color(random(255),random(255),random(255)); 
	fill(colors[i]) 
} 
 
function RandDraw(rowNum, colNum){ 
  noStroke(); 
  var stepX = width/rowNum; 
  var stepY = height/colNum; 
  for (var i = 0; i < colNum; i++) { 
    for (var j = 0; j < rowNum; j++) { 
      Randpaint(i*rowNum + j) 
      rect(i * stepX, j * stepY, stepX, stepY); 
    } 
  } 
} 
 
function setup() { 
  createCanvas(500, 500);  
}   
 
function draw(){ 
  RandDraw(3, 3)	 
}
<script src="https://cdn.jsdelivr.net/npm/p5@0.10.2/lib/p5.js"></script>

READ ALSO
Заполнить матрицу целыми числами по спирали JS

Заполнить матрицу целыми числами по спирали JS

Здравствуйте! Написала скрипт, который, по идее, должен генерировать матрицу размером 3х3 по спирали, начиная с левой стороныВсе бы ничего,...

203
Калькулятор на чистом JS

Калькулятор на чистом JS

Я недавно начал изучать JS (чистый) и решил создать калькуляторНесколько сделать удалось, но с одним не могу разобраться вот уже 10-ый день

78
Почему телеграм не отображает превью конкретно моей ссылки?

Почему телеграм не отображает превью конкретно моей ссылки?

К примеру, когда я делюсь ссылкой на другие сайты, телеграм подхватывает и делает превью, однако в случае с моим веб-ресурсом такое не происходит:

309