He escrito un juego de estrategia en tiempo real (una demostración para una especie de motor de juego, en realidad) en el que la interacción básica del usuario con el juego es seleccionar un grupo de soldados y luego hacer clic derecho en el mapa para moverlos a la ubicación especificada. Esto está en JavaScript y puedes jugar con él aquí ( código ).
Ignorando el problema de cómo se mueven los soldados desde su ubicación actual hasta su destino, mi pregunta es sobre determinar cuál es su destino real. Esto es lo que he probado hasta ahora:
- Intento 1: Indique a todos los soldados seleccionados que se muevan a las coordenadas en las que hizo clic el mouse. Esto tiene el extraño comportamiento de que todos los soldados se agruparán alrededor del objetivo de forma antinatural.
- Intento 2: Encuentre las coordenadas promedio de todos los soldados seleccionados, luego encuentre el desplazamiento desde ese punto central para cada soldado, y finalmente traduzca ese desplazamiento alrededor de las coordenadas del mouse. Esto funciona bien, excepto que si los soldados seleccionados están muy separados, no se acercarán al objetivo.
- Intento 3: Construya una cuadrícula alrededor de las coordenadas del mouse y coloque a cada soldado seleccionado en una celda de la cuadrícula. Si cada soldado llega a su celda asignada, esto funciona muy bien. Sin embargo, los soldados se asignan a las celdas de la cuadrícula en el orden en que se generaron los soldados, por lo que a veces chocan (es decir, todos los soldados en el lado derecho intentarán ir al lado izquierdo), lo que parece antinatural.
- Intento 4: use una cuadrícula como antes, pero primero ordene a los soldados por ubicación para que se alineen con sensatez, es decir, si hizo clic debajo del grupo, los soldados en la parte inferior del grupo terminarán en la parte inferior de la cuadrícula cuando llegar a su destino Esto funciona bastante bien, pero a veces hay fallas y no estoy seguro de por qué.
Aquí está la función que determina las coordenadas de destino:
function moveSelectedSoldiersToMouse() {
var w = 0, h = 0, selected = [];
// Get information about the selected soldiers.
myTeam.soldiers.forEach(function(soldier) {
if (soldier.selected) {
selected.push(soldier);
w += soldier.width;
h += soldier.height;
}
});
var numSelected = selected.length, k = -1;
if (!numSelected) return;
// Build a grid of evenly spaced soldiers.
var sqrt = Math.sqrt(numSelected),
rows = Math.ceil(sqrt),
cols = Math.ceil(sqrt),
x = Mouse.Coords.worldX(),
y = Mouse.Coords.worldY(),
iw = Math.ceil(w / numSelected), // grid cell width
ih = Math.ceil(h / numSelected), // grid cell height
wg = iw*1.2, // width of gap between cells
hg = ih*1.2; // height of gap between cells
if ((rows-1)*cols >= numSelected) rows--;
w = iw * cols + wg * (cols-1); // total width of group
h = ih * rows + hg * (rows-1); // total height of group
// Sort by location to avoid soldiers getting in each others' way.
selected.sort(function(a, b) {
// Round to 10's digit; specific locations can be off by a pixel or so
var ax = a.x.round(-1), ay = a.y.round(-1), bx = b.x.round(-1), by = b.y.round(-1);
return ay - by || ax - bx;
});
// Place the grid over the mouse and send soldiers there.
for (var i = 0; i < rows; i++) {
for (var j = 0; j < cols; j++) {
var s = selected[++k];
if (s) {
var mx = x + j * (iw+wg) - w * 0.5 + s.width * 0.5,
my = y + i * (ih+hg) - h * 0.5 + s.height * 0.5;
// Finally, move to the end destination coordinates
s.moveTo(mx, my);
}
}
}
}
Puede pegar esta función en la consola de JavaScript de su navegador al ver la demostración y jugar con ella para cambiar el comportamiento de los soldados.
Mi pregunta es: ¿hay una mejor manera de determinar la ubicación del objetivo para que se mueva cada soldado?