¿Cómo debo obtener bloques adyacentes del mismo color?

Estoy tratando de hacer un juego de combinación de colores simple y quiero encontrar una manera de seleccionar grupos de bloques del mismo color.

Este es el violín Estoy trabajando, y si lo ejecutas, verás que hay problemas cuando trato de pasar el mouse sobre los elementos en los bordes del área del juego, lo que me dice que está tratando de usar variables no definidas.

Si marca a continuación, en el parse_quad_tree() función verán que manejo el caso de vars indefinidos, pero como frena, significa que estoy equivocado en alguna parte...

Gracias por tu tiempo

preguntado el 03 de mayo de 12 a las 18:05

4 Respuestas

Su matriz 2d es realmente matrices anidadas. Solo debe verificar el nivel de la matriz que posiblemente se salga de los límites:

var n = !!grid[x][y-1]?grid[x][y-1]:false;
var s = !!grid[x][y+1]?grid[x][y+1]:false;
var e = !!grid[x-1]?grid[x-1][y]:false;   // Instead of !!grid[x-1][y]
var w = !!grid[x+1]?grid[x+1][y]:false;   // Instead of !!grid[x+1][y]

En otras palabras, cuando haces array[x][y], javascript primero recupera array[x], y luego busca el índice [y] en esa matriz recuperada. En su caso, la primera búsqueda no está definida (grid[x-1]), por lo que no puede mirar hacia arriba grid[x-1][y]. Está buscando indefinido en el último paso, cuando el primer paso no está definido.

Demostración: http://jsfiddle.net/jtbowden/qWktv/

Además, si tú $(c).addClass('active') al comienzo de parse_quad_tree, podrá resaltar bloques individuales y no tendrá que llamar a `.addClass('active') para cada vecino porque ocurrirá al comienzo de la recursión.

Demostración: http://jsfiddle.net/jtbowden/qWktv/1/

contestado el 03 de mayo de 12 a las 18:05

Aunque muchas respuestas responden correctamente a mi pregunta, acepto esto porque describe mejor la razón por la que mi script falló. Gracias :) - lupax

No está comprobando si su primera matriz var existe antes de llamar a la submatriz, cambiar,

var e = grid[x-1]&&!!grid[x-1][y]?grid[x-1][y]:false;
var w = grid[x+1]&&!!grid[x+1][y]?grid[x+1][y]:false;

contestado el 03 de mayo de 12 a las 18:05

No necesita marcar ambos, porque por definición del problema se definirá el subarreglo en este caso. Solo necesita verificar en la dirección en la que se está "moviendo". - Jeff B

@ GabyakaG.Petrioli No importa en js, fuera de los límites solo devuelve undefined, que se maneja correctamente. - Andrés

Necesitas revisar tus límites

var n = !! (y > 0 && grid[x][y - 1]) ? grid[x][y - 1] : false;
var s = !! (y < grid[x].length-1 && grid[x][y + 1]) ? grid[x][y + 1] : false;
var e = !! (x > 0 && grid[x - 1][y]) ? grid[x - 1][y] : false;
var w = !! (x < grid.length-1 && grid[x + 1][y]) ? grid[x + 1][y] : false;

Demo en http://jsfiddle.net/gaby/yHKkg/64/

contestado el 03 de mayo de 12 a las 18:05

En lugar de usar var colors = ['red', 'green', 'blue']; para sus colores, use tres clases CSS diferentes con un conjunto de colores. De esta manera, cuando necesite seleccionarlos todos, es tan fácil como $(".blue").

contestado el 03 de mayo de 12 a las 18:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.