Wie gehe ich von Weltkoordinaten (X / Y) zu Kachelkoordinaten?

Also habe ich dieses Spiel in einer gefälschten isometrischen Ansicht mit dem folgenden Code zum Generieren des Netzes gerendert:

_x = x + ( y & 1 > 0 ? 0 : 0.5 );
_y = y * 0.25;

ADD_VERTICES( [
        _x-0.5,  _y,      0,  _uv[0], _uv[3], //B
        _x,      _y+0.25, 0,  _uv[0], _uv[1], //A
        _x+0.5,  _y,      0,  _uv[2], _uv[1], //C

        _x+0.5,  _y,      0,  _uv[2], _uv[1], //C
        _x,      _y-0.25, 0,  _uv[0], _uv[1], //D
        _x-0.5,  _y,      0,  _uv[0], _uv[3], //B
] );

Das schafft Quads (wirklich 2 Dreiecke) mit den folgenden Ecken:

0 0 [0.5, -0.5  -   0, 0,       -   0.5, 0.5    - 1, 0]
1 0 [1.5, -0.5  -   1, 0,       -   1.5, 0.5    - 2, 0]
0 1 [0, 0       -   -0.5, 0.5   -   0, 1        - 0.5, 0.5]
1 1 [1, 0       -   0.5, 0.5    -   1, 1        - 1.5, 0.5]

Ich kann die Weltkoordinaten von der Mausposition aus abrufen, aber ich kann für mein ganzes Leben nicht herausfinden, wie ich von den Weltkoordinaten zurück zu den Kachelkoordinaten komme. Was ist der Algorithmus dafür? (Oder wie kann ich die Eckpunkte ändern, damit dies einfacher ist?)

Zuerst müssen Sie die Nummerierung Ihrer Kacheln in einer isometrischen Karte neu organisieren. Es ist viel einfacher, die isometrische Achse entlang der Kacheln zu definieren.

So was

Schauen Sie sich das folgende Tutorial an, das das beste ist, das ich im Internet gefunden habe. Es gibt eine Menge isometrischer Karten-Mathe-Tutorials im Internet, aber dieser Typ ist ein Prophet!

http://clintbellanger.net/articles/isometric_math/

Wie im Tutorial angegeben, können Sie die Kartenkoordinate über die folgenden Gleichungen in isometrische Koordinaten umwandeln

screen.x = (Isomap.x - Isomap.y) * TILE_WIDTH_HALF;
screen.y = (Isomap.x + ISomap.y) * TILE_HEIGHT_HALF;

Da Ihre Kacheln die gleiche Breite und Höhe haben, ist es etwas einfacher, aber ich habe diese Kachelgröße verwendet: (36,24), die besser aussieht, aber immer noch hoch genug ist, damit alle Elemente auf der Karte ohne große Überlappung angezeigt werden können

Die obige Formel muss jedoch möglicherweise ein wenig geändert werden, da der Ursprung des Kacheln-Koordinatensystems der obige Punkt der ersten Kachel von oben ist. Sie können jedoch die Mitte der oberen Kachel als Ursprung verwenden, den ich persönlich unten links verwendet habe Scheitelpunkt von MBB der obersten Kachel als Ursprung Also musste ich die Koordinatenhalbbreite, Halbhöhe übersetzen (verschieben), also war dies meine:

func project(Cartesian screen : CGPoint) -> CGPoint {
    let TILE_WIDTH_HALF = (tileWidth / 2)
    let TILE_HEIGHT_HALF = (tileHeight / 2)
    let movedScreen = CGPointMake(-1, -1) * (screen - CGPointMake(tileWidth,tileHeight))
    let mapx = ((movedScreen.x / TILE_WIDTH_HALF) + (movedScreen.y / TILE_HEIGHT_HALF)) / 2;
    let mapy = ((movedScreen.y / TILE_HEIGHT_HALF) - (movedScreen.x / TILE_WIDTH_HALF)) / 2;
    return CGPointMake(mapx+0.5, mapy+1.5)
}

Wenn Sie genauer hinschauen, sehen Sie, dass ich Y vor und nach der Tile 2 Map-Transformationsformel invertiere, da in iOs y aufsteigt, indem es auf dem Bildschirm nach oben geht, aber im Tutorial y absteigt, indem es nach oben geht.

Wenn Sie also Ihr Spiel für ein mobiles Gerät schreiben, müssen Sie es auch tun

Am Ende meiner Funktion habe ich 0,5,1,5 zu meinem angeblichen Kacheln-Koordinatensystem hinzugefügt.

Wie Sie sehen, ist es etwas verwirrend und je nachdem, wie Sie Ihre Kacheln gezeichnet haben und Ihre positive Richtung nach oben oder unten zeigt, müssen Sie die Grundformel im Tutorial leicht ändern. Es tut mir leid, dass ich Ihnen nicht die genaue Gleichung liefern kann, aber ich kann Ihnen zeigen, wie es geht. (Finde deine eigenen Gleichungen)

Schreiben Sie die Grundformel auf, aber fügen Sie beiden Gleichungen einen Tx und einen Ty hinzu. Sie müssen herausfinden, was Tx und Ty in Ihrem Fall ist. Um herauszufinden, was sie sind, schreiben Sie einfach die Gleichungen für zwei verschiedene Kacheln (z. B. Kachel 0,1 und Kachel 1,1), wie Sie es in Ihrer obigen Frage getan haben. Danach haben Sie eine vollständige Gleichung.

    screen.x = (Isomap.x - Isomap.y) * TILE_WIDTH_HALF + Tx;
    screen.y = (Isomap.x + ISomap.y) * TILE_HEIGHT_HALF+ Ty;

Und hier ist mein umgekehrter Code. Wenn Sie ihn mit dem Tutorial vergleichen, werden Sie feststellen, dass er sich ebenfalls geringfügig geändert hat. und du musst deine eigene durch die Fähigkeit finden, die du gerade oben erworben hast.

func unproject (tileIndex tileIdx : CGPoint) -> CGPoint
{
    let TILE_WIDTH_HALF = (tileWidth / 2) // 16
    let TILE_HEIGHT_HALF = (tileHeight / 2) // 12

    let screenX = TILE_WIDTH_HALF * (tileIdx.y - tileIdx.x + 1)
    let screenY = 24 - TILE_HEIGHT_HALF * (tileIdx.x + tileIdx.y)
    return CGPointMake(screenX, screenY)

}