Rotierender Teil eines Bildes im 3D-Raum

Question

Hier ist das Setup: Dies ist für eine E-Commerce-Kunst-Website, wo einige Gemälde Leinwand Transfers sind. Das Gemälde umschließt die Seiten und die Ober- und Unterseite der Leinwand. Wir haben hochauflösende Bilder des gesamten Gemäldes, aber was wir zeigen möchten, ist eine quasi 3D-Darstellung des Bildes, in der Sie sehen können, wie die Seiten des Gemäldes die Leinwand umhüllen. Hier ist eine grobe Skizze von dem, was ich spreche:

Meine Frage ist, wie kann ich ein Bild im 3D-Raum drehen? Der Ansatz, den ich gerne machen würde, besteht darin, einen Teil der Bildoberseite und -seite abzuschneiden und dann in 3D zu rotieren und dann wieder nach oben und seitlich zu stechen, um ihm das 3D-Aussehen zu geben. Wie gehe ich darüber vor? Es kann mit jeder .Net-Technologie (GDI +, WPF usw.) durchgeführt werden.

Answer 1

In WPF mit der ViewPort3D-Klasse können Sie einen Quader mit 8x5x1 Einheiten erstellen. Erstellen Sie das Bild als Textur und wenden Sie dann die Textur auf die Vorderseite (8x5) und die Seitenflächen (5x1) und die Ober- und Unterseite (8x1) mit Texturkoordinaten an. Die Koordinaten der Vorderseite sollten (1/9, 1/6), (8/9, 1/6), (1/9, 5/6) und (8/9, 5/6) für die Vorderseite sein und von der nächsten Kante zu jenen Koordinaten für die Seiten, z für die linke Seite: (0, 1/6), (1/9, 1/6), (0, 5/6) und (1/9, 5/6) für die linke Seite.

Edit: Wenn Sie dann in der Lage sein wollen Modell auszuführen Drehungen auf dem 3D-Leinwand können Sie den Rat hier folgen: How can I do 3D transformation in WPF?

Answer 2

Ich habe keine Erfahrung in dieser Art von Sachen. Aber als ich diese Frage sah, fällt mir als erstes das komische Unicornify für SO ein.

In diesem making of Artikel von balpha, erklärte er, wie die 2d Einhornkugel in 3d Raum gedreht wird.

Aber die code ist in Python geschrieben. Wenn Sie interessiert sind, können Sie einen Blick darauf werfen. Aber ich bin mir nicht sicher, ob dir das helfen würde.

Answer 3

Der Brute-Force-Ansatz (der der einfachste Ansatz sein könnte) besteht darin, die u, v-Texturkoordinaten für jede der drei Flächen auf drei Werbetafeln abzubilden, die drei Seiten der Leinwand darstellen (eine Werbetafel sind nur zwei Dreiecke) mache ein Rechteck). Drehen Sie dann die gesamte Leinwand (alle drei Werbetafeln) mithilfe von Matrixtransformationen. Tada!

Alternativ können Sie die Position der 3-Raumkamera mit einer Transformation und nicht mit der Leinwand verschieben. Sechs von eins, halb die anderen - wie sie sagen.

Answer 4

Es sieht aus wie Sie nicht echte 3D zu tun brauchen, aber nur muss es vortäuschen.

Hacken Sie vier Streifen oben, unten, links und rechts vom Bild ab. Toss den Boden und rechts (geht durch Ihre Skizze in der Frage). Scale und schere die Streifen (Ich bin nicht Experte genug. NET/WPF zu wissen, wie, aber es kann es tun). Die Oberseite würde vertikal um einen Faktor von 0,5 skaliert (eine Schätzung - wählen Sie, um das gewünschte endgültige 3D-Bild zu passen) und horizontal geschert. Das Ergebnis wird auf dem Ausgabebild als oberste Seite der Zeichenfläche zusammengesetzt. Der linke Streifen würde horizontal skaliert und vertikal geschert werden.

Wenn der Endbenutzer die 3D-Leinwand interaktiv aus verschiedenen Blickwinkeln betrachten soll, ist diese Methode wahrscheinlich schneller als das Rendern eines ehrlichen 3D-Modells, das Textur-Mapping und Rasterisierung des Modells zu einem endgültigen Bild machen müsste die gleiche Mathematik machen. Der Spaßfaktor besteht darin herauszufinden, wie die Skalierungs- und Scherparameter eingestellt werden.

könnte Diese Seite lehrreich: http://www.idomaths.com/linear_transformation.php
und diese nützliche Referenz http://en.csharp-online.net/GDIplus_Graphics_Transformation%E2%80%94Image_Transformation