Cómo calcular la altura y el ancho de un rectángulo/cuadrado isométrico

Question

Escribo un juego de fichas isométricas. Cada azulejo es el doble de ancho que alto (w: h = 2: 1). Todas las fichas de un mapa tienen el mismo tamaño y se conocen su ancho y altura (TileWidth y TileHeight).

Puede haber cualquier cantidad de columnas (> 0) y filas (> 0).

Estoy luchando por encontrar una fórmula para calcular el ancho y la altura del mapa dibujado por completo. Debe ser la distancia desde la parte superior hasta la parte inferior y la extrema izquierda hasta la extrema derecha. Como el número de columnas y filas puede variar (y, por lo tanto, el mapa no siempre es un diamante perfecto) ¡está resultando muy difícil!

Answer 1

Buena pregunta! Hay una respuesta no demasiado obvia pero es fácil de calcular:

Llamemos al eje de fila "r" y el eje de columna "c", y consideremos la primera imagen, donde la extensión a lo largo del eje r es 5 y la extensión a lo largo del eje c es 3.

El incremento de la unidad a lo largo del eje r, relativo al plano de dibujo, está en el ángulo +30 = (cos 30 °, sen 30 °) = (sqrt (3)/2 , 0.5), y el incremento de la unidad a lo largo del eje c está en -30 = (cos 30 °, -sin 30 °) = (sqrt (3)/2, -0.5).

Debe tener en cuenta las dos diagonales de su rectángulo isométrico. En la primera imagen, esas diagonales son D1 = [+ 5 * U a lo largo del eje ry + 3 * U a lo largo del eje c] y D2 = [+ 5 * U a lo largo del eje ry -3 * U a lo largo del eje c ], donde U es la longitud de la losa en el plano isométrico. Cuando se transforma en el plano de dibujo, esto se convierte en D1 = ((5 + 3) * sqrt (3)/2 * U, (5-3)/2 * U) = (4 * sqrt (3) * U, 1 * U) y D2 = ((5-3) * sqrt (3)/2 * U, (5 + 3)/2 * U) = (sqrt (3) * U, 4 * U). El ancho y el alto de la pantalla, por lo tanto, son el máximo de las dos extensiones = 4 * sqrt (3) * U, 4 * U.

Esto se puede generalizar: si hay Nr filas y Nc columnas, y la longitud de la losa es U, la extensión de las diagonales del rectángulo en el plano de dibujo es D1 = ((Nr + Nc) * sqrt (3)/2 * U, (Nr-Nc)/2 * U) y D2 = ((Nr-Nc) * sqrt (3)/2 * U, (Nr + Nc)/2 * U), y el ancho de la pantalla y la altura, por lo tanto, son:

W = U*(Nr+Nc)*sqrt(3)/2 
H = U*(Nr+Nc)/2 

Answer 2

Por qué no utilizar las ecuaciones de rotación de la siguiente manera:

Supongamos que las baldosas no se giran, por lo que las cuatro esquinas tienen las siguientes coordenadas:

(0, 0, 0) 
(w, 0, 0) 
(0, h, 0) 
(w, h, 0) 

donde

w = Number of Columns * Tile Width 
h = Number of Rows * Tile Height 

Ahora supongo tienes la matriz de proyección, así que después de aplicarla, obtienes coordenadas de pantalla 2D de los 4 puntos 3D, y lo que tienes que hacer es esto:

1. Obtenga la coordenada x mínima de todos los puntos (después de la proyección).
2. Obtenga la coordenada x máxima de todos los puntos (después de la proyección).
3. Obtenga la coordenada y mínima de todos los puntos (después de la proyección).
4. Obtenga la coordenada y máxima de todos los puntos (después de la proyección).

Reste 1 de 2, y obtendrá el ancho, y 3 de 4 para obtener la altura.

¿Eso ayuda?

Answer 3

creo que se podría hacer esto con Pythagoras' theorem:

halfWidth = tileWidth/2; 
halfHeight = tileHeight/2; 
h = Math.sqrt((halfWidth * halfWidth) * (halfHeight * halfHeight)); 
rowLength = rowSize * h; 
colLength = colSize * h; 

mis matemáticas no son grandes, pero h debe ser la longitud de un lado de una baldosa por lo que puede que se multiplican por el número de baldosas.

Answer 4

Los ángulos de la proyección isométrica son 60deg y 30deg. La anchura y la altura reales de una baldosa serán:

Wiso = TileWidth * Cos(30) + TileHeight * Cos(60)
Hiso = TileWidth * Sin(30) + TileHeight * Sin(60)

Ahora puede agregar multiplicar estas cifras por el número de tejas por fila y columna para obtener el tamaño de la red.

EDIT: mirar sus imágenes, parece que la proyección no es isométrica (al menos no lo que aprendí en la escuela), y los ángulos son 60 grados a ambos lados, por lo que reemplazar el Cos(60) con Cos(30) y la Sin(60) con Sin(30)

Otra forma de verlo:

Wgrid = TileWidth * Cos(30) * Ncols + TileHeight * Cos(30) * Nrows
Hgrid = TileWidth * Sin(30) * Ncols + TileHeight * Sin(30) * Nrows

Answer 5

Si se inicia en la parte inferior y caminar por el lado izquierdo, usted pasa la mitad de la altura del azulejo para cada columna, entonces la mitad de la altura de cada fila. De manera similar, si comienza por la izquierda y camina por el borde inferior, se mueve la mitad del ancho del mosaico para cada columna, luego la mitad del ancho para cada fila.

Así que la anchura de la caja de contorno eje alineado para el mapa es (rows+columns)*TileWidth/2 y la altura es (rows+columns)*TileHeight/2