SVG VML-3D-MATH – ŁATWY WYJAŚNIENIE


Original: http://www.lutanho.net/svgvml3d/svgvml3d_math.html

Dawno, przyjaciel i oddany hobby-programista zapytał mnie, jak mam to wszystko 3 wymiarowe stuff rysunek, a kiedy okazało się, że nie był jedynym, który miał problemy z zatrzymaniem matematyki w odpowiedni sposób. Więc tutaj jest trochę wyjaśnienia podstawowej matematyki moich SVG VML-3D stron dla wszystkich tych, którzy są również błahy wokół whith ten temat.

Powiedzmy, że masz swoje obiekty 3D w zakresie pola

{Xmin, Xmax, Ymin, ymax, zmin, zmax}

W pierwszym transformacji współrzędnych przesunięcia pole tak, że jego środek znajduje się w produkcji:

xd = (xmin + xmax) / 2,
m = (ymin + ymax) / 2,
zd = (zmin + zmax) / 2

x ‘= x-xD, r’ = r-m, Z “= Z-ZD

Więc masz już swoje obiekty w zakresie pola

{-X’m, x’m,-y’m, y’m,-z’m, z’m}

Teraz czas, aby przedstawić nasz 3D układ współrzędnych:

z
|
|
|
| _______ Y
/
/
/
x

Powiedzmy, że stoję u (1000,0,0) i spójrz na pochodzenie (0,0,0), gdzie można zobaczyć wszystkie obiekty 3D, które są w pobliżu (0,0,0). Teraz wróćmy obiektów wokół osi z o kąt Φ. Jaka będzie nowa pozycja punktu (x ‘, y’ z ‘) po tym? Jak łatwo zobaczyć, z-składnik nie zmieni, więc mamy z” = z ‘. Ale co x ‘y’? Gdy patrzymy od góry systemu współrzędnych widzimy to:

Y _______________
|. .
|. .
|. .
|. ___ /.
|. Φ * (x”, y”)
|.
|.
| * (X ‘, y’)
|
x

Wydaje się, że trudno znaleźć formułę, która oblicza x” i” y od x ‘, y’ i Φ, ale gdy robimy oddzielnego obliczenia dla x ‘y’, to się to łatwiejsze, spojrzeć na to:

_______________ Y * (x”, y”)
|. . x” = – y ‘sin (Φ)
|. . y” = y ‘cos (Φ)
|. x” = x cos (Φ) | ———- * —- y
|. y” = x sin (Φ) | (0, y ‘)
|. |
| * (X”, y”) |
* (X, 0) |
| |
x x

Teraz możemy dodać elementy dla x, y, z i zapisz go prawidłowo:

x” = x * cos (Φ) – y ‘* sin (Φ) + z’ * 0
y” = x * sin (Φ) + y ‘* cos (Φ) + z’ * 0
z” = x ‘* 0 + y’ * 0 + z ‘* 1

To dobra rzecz to zrobić z macierzy i wektora, więc będzie to wyglądać tak:

(X”) (cos-sinΦ 0) (x ‘)
y” = sinΦ cos 0 * y ‘
z” 0 0 1 z ‘

OK, ale jak o włączeniu wszystkie rzeczy dodatkowo wokół osi Y o kąt Θ, więc wygląda na to, jeśli widok z wyższej pozycji w dół do obiektów 3D (widok z wyższej pozycji w dół do obiektów – nie robi ‘ t to brzmi wspaniale?). Również w ten sposób oś będzie pionowo pozostają, więc jest to, co musi się często w 3D-reprezentacji gdy oś zawsze powinien wskazywać na górnej części ekranu. Więc pozwala próby zastosowania tego samego matematyki że używane do obrotu wokół osi z. Kiedy patrzymy z prawej strony, układ współrzędnych wygląda tak:

z z
| |
(X” ‘, Z”’) | (0, Z”) * (x” ‘, Z”’)
* | X” ‘x” = cos (Θ) | *
. | Z” ‘x” = sin (Θ) |. x” ‘= – z grzechem” (Θ)
. | |. z” ‘= z” cos (Θ)
x — * ——- | x ————
(” X, 0)

Pisanie grzywny rzeczy razem, otrzymamy

x” ‘=” x * cos (Θ) – y” * 0 – z” * sin (Θ)
” Y “= * 0” x + y +” * 1 * 0 z”
z” ‘= x” * sin (Θ) + y” * 0 + z” * cos (Θ)

A w zapisie macierzowym:

(X” ‘) (cosΘ 0-sinΘ) (x”)
” Y “= 0 1 0 * r”
z” ‘sinΘ 0 cosΘ z”

Teraz wykonaj dwa obroty w jednym kroku whithout obliczania (x”, y”, z”) wektor:

(X” ‘) (0-sinΘ cosΘ) [(cos-sinΦ 0) (x)]
y” ‘= 0 1 0 * 0 * sinΦ cos y’
z” ‘sinΘ 0 cosΘ 0 0 1 z’

Zapewne wiesz z lekcji algebry, które możemy wykorzystać * (B * C) = (A * B) * C do uproszczenia mnożenia macierzy, więc mamy:

(X” ‘) (cosΦcosΘ-sinΦcosΘ-sinΘ) (x’)
y” ‘= sinΦ cos 0 * y’
z” ‘cosΦsinΘ-sinΦsinΘ cosΘ z’

Wreszcie otrzymujemy położenie punktu w układzie współrzędnych ekranu,

xs = y” ‘= sinΦ x’ + cos y ‘
ys = z” ‘= cosΦsinΘ x’ – sinΦsinΘ y ‘+ cosΘ z’
zs = x” ‘= cosΦcosΘ x’ – sinΦcosΘ y ‘+ sinΘ z’

Ilość pikseli w y jest z góry na dół, więc dostaniesz odpowiednie cyfry pikselu xpixel = xcenter + xs i ypixel = ycenter-ys. ZS można zamówić obiektów przed rysunku, tak, że można rozpocząć rysunek z przedmiotem, który ma najmniejszą ZS.
Aktualne zdjęcie nie pokaże żadnej perspektywy, wygląda to tak, jakbyś stał bardzo daleko. Jeśli chcesz uzyskać bardziej realistyczne wrażenie, trzeba zmienić formułę tylko trochę. Zakładamy, że stanowisko jest (0,0, d), tak d to odległość od niego pochodzą. Gdy patrzy się w punkcie (xs, 0, zs), a następnie jego obraz będzie (x,, 0, 0), a wszystkie punkty obrazu znajduje się w tej samej płaszczyźnie, w którym Z = 0:

| (X,, 0,0)
— | ——– * ———- X
|.
|.
| * (Xs, 0, zs)
|.
|.
|.
|.
|.
o (0,0, d)
|
z

Następnie pojawi się przez podobne trójkąty

(X’s-xs) / zs = xs / (d-ZS)

więc nowy współrzędnych ekranu z perspektywy jest

iksy = xs * (d / (d-zs))
y. = ys * (d / (d-zs))

Zauważ, że teraz również kolejność rysowania należy zmienić: Zamiast sortowania obiektów według ich zs, obiekty powinny teraz zostać posortowane według ich odległości (0,0, d).
O.k. ludzie, że to wystarczy na początek, jeśli chcesz zobaczyć, jak I wdrożone to, to spojrzeć na moich przykładach SVG VML-3D.