I'm trying to calculate certain rectangle positions and sizes in the grid, and I'd like to randomize them per each tile.
Can something like this be done:
for (let x = 0; x < p.width; x += tiles) {
for (let y = 0; y < p.height; y += tiles) {
let subItemPerTile = p.random(itemsPerTile);
// This should contain random X/Y options using -i, +i, *i in a list
let coordinatesPerTile = [['x', 'y'], ['x-i', 'y-i'], ['x+i', 'y-i']];
for (let i = tilesInGrid; i > 0; i--) {
p.fill(p.color(p.random(255)));
let s = (tiles * i) / subItemPerTile;
// This is working method where I'd like to substitute randomly, x,y,s from the list above
// p.square(x, y, (tiles * i) / subItemPerTile);
//This was desired way, and I had 's' as the part of the list, but removed it until I figure out if this can be done this way
//p.square.apply(null, p.random(coordinatesPerTile);
//p.square(...coordinatesPerTile);
// This is me debugging on second item in the list
let coords = coordinatesPerTile[1];
x = eval(coords[0]);
y = eval(coords[1]);
console.log(coords[0]);
// let s = eval(coords[2]);
// console.log(s);
// Below works for coordinatesPerTile[0], but not for coordinatesPerTile[1], I don't understand why
p.square(x, y, s);
}
There is no implicit conversion from a string that includes javascript to the result of evaluating that javascript in the local scope, and any mechanism to do that would be an extremely bad idea. This is probably what you want:
function sketch(p) {
const tileSize = 20;
const itemsPerTile = [1, 2, 3, 4];
p.setup = function() {
p.createCanvas(300, 300);
p.frameRate(1);
};
p.draw = function() {
for (let x = 0; x < p.width; x += tileSize) {
for (let y = 0; y < p.height; y += tileSize) {
let subItemPerTile = p.random(itemsPerTile);
for (let i = subItemPerTile; i > 0; i--) {
// By simply declaring this inside the for loop that
// defines i, the code is quite simple
let coordinatesPerTile = [
[x, y],
[x - i, y - i],
[x + i, y - i]
];
p.fill(p.color(p.random(255)));
let s = (tileSize * i) / subItemPerTile;
p.square(...p.random(coordinatesPerTile), s);
}
}
}
};
}
new p5(sketch);<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>Because your code was incomplete there is a lot of guesswork that went into making the above sketch do something useful.