Estoy tratando de construir una aplicación que genere un mapa aleatorio usando mosaicos cuadrados. Para hacer esto, mi plan es usar una matriz 2D que selecciona aleatoriamente el primer mosaico en una fila y luego, al seleccionar aleatoriamente el segundo mosaico, hace referencia al valor del borde derecho del mosaico anterior y filtra los posibles mosaicos aleatorios que puede elegir hacia abajo. a una matriz de solo aquellos que coinciden. Este proceso se repite hasta que se completa la fila, luego, al comenzar una fila posterior, el filtro se aplicará tanto al borde derecho del mosaico anterior como al borde inferior del anterior.
Llegué al punto en que puedo generar una matriz llena de mosaicos aleatorios, pero no puedo hacer que funcione el proceso de filtrado. He intentado usar un .filter en la función de selección aleatoria, pero cuando intenta hacer referencia al índice anterior, ese índice no está definido.
Los mosaicos son una matriz de objetos como este:
1 significa un borde conectado, 0 significa que no hay conexión. Esencialmente, las fichas solo tienen que hacer coincidir 1 con 1 y 0 con 0.
[ { "top": 1, "right": 0, "bottom": 1, "left": 0, "img": "../public/images/1.png" }, { "top": 0, "right": 1, "bottom": 0, "left": 1, "img": "../public/images/2.png" } ]Mi código actual se ve así:
// Setting the number of row and columns and creating the empty array const rows = 5; const columns = 5 const map = []; // Populate the empty array with a 2D array of random tile objects. function generateMap() { for (let y = 0; y < rows; y++) { map[y] = []; for (let x = 0; x < columns; x++) { map[y][x] = randomlyPopulateMap(x, y); } } } function randomlyPopulateMap(x, y) { const randNum = Math.floor(Math.random() * tiles.length); const randTile = tiles[randNum]; return randTile; }Probé lo que se siente como una docena de soluciones, pero todavía soy nuevo en la codificación y no estoy seguro si estoy tomando el enfoque correcto para este problema. Cualquier orientación es muy apreciada.
Puedo imaginar que randomlyPopulateMap primero filtre los mosaicos en función de si coinciden de izquierda a derecha con el mosaico de la izquierda y de arriba a abajo con el mosaico de arriba. Estoy usando la condición de que si no hay un mosaico arriba para restringir, cualquier mosaico servirá. Puede decidir si el propio límite impone restricciones adicionales.
function randomlyPopulateMap(x, y) { const candidates = tiles.filter(tile => (x == 0 || tile.left == map[y][x-1].right) && (y == 0 || tile.top == map[y-1][x].bottom)) y luego elige una ficha al azar de entre los candidates restantes.
const randNum = Math.floor(Math.random() * candidates.length); const randTile = candidates[randNum]; return randTile; }