How can i put random images on random position on a grid

p5.js Coding Questions
1

now I have the image on the grid with a sequence. I want to know how to put the image in a random position.
Link: p5.js Web Editor

let imgs = ;

function preload() {
for (let i = 1; i < 10; i++) {
imgs[i] = loadImage(i + “.jpg”);
}
}

function setup() {
createCanvas(400, 400);
background(255);
}

function draw() {
let cx = floor(mouseX / (width / 3));
let cy = floor(mouseY / (height / 3));
for (let x = 0; x < 3; x++) {
for (let y = 0; y < 3; y++) {
for (let z = 1; z <= x+y*3+1 ; z++) {
rect((x * width) / 3, (y * height) / 3, width / 3, height / 3);
if (cx == x && cy == y) {
image(
imgs[z],
(x * width) / 3 + 1,
(y * height) / 3 + 1,
width / 3,
height / 3
);
}
}
}
}
}

2

Hi @yoyo,

first I would change the imgs array that way that there are no undefined in it (Arrays start with index 0, so in your approach the element at 0 is undefined as you are starting with 1).
Afterwards you can use the following function to shuffle it.

Cheers
— mnse