DGL • Thema anzeigen - Objekt auswählen (Picking)

Objekt auswählen (Picking)

Moderator: DGL-Team

Seite 1 von 1

[ 4 Beiträge ]

Vorheriges Thema | Nächstes Thema

Autor

Nachricht

knosk

Betreff des Beitrags: Objekt auswählen (Picking)

Verfasst: Do Jun 02, 2011 12:37

DGL Member

Registriert: Do Jun 02, 2011 11:49
Beiträge: 2

Hi,
ich hab mich in letzter Zeit ein wenig mit WebGL beschäftigt. Jetzt hab ich überlegt, wie ich ein Objekt auswählen kann und dann die genauen Koordinaten um 3-dimensionalen Raum erhalte.
Nach ein wenig surfen hab ich dann folgenden Code geschrieben.

Code:

 
var pixel = quat4.create([mouseX,mouseY,0,1]);   // mouseX = 530 und mouseY = 250
 
var view = webGL.getParameter(webGL.VIEWPORT); // view = 0, 0, 800, 500               
 
// mvMatrix =
// 1, 0,  0,   0,
// 0, 1,  0,   0,
// 0, 0,  1,   0,
// 2, 0, -10, 1
// -------------
// pMatrix =
// 1.5088834762573242, 0,                            0,    0,
// 0,                            2.4142136573791504, 0,    0,
// 0,                            0, -1.0020020008087158, -1,
// 0,                            0, -0.20020020008087158, 0
 
var allMultiplied = mat4.multiplyVec4(mat4.multiply(mvMatrix, pMatrix), view);
// allMultiplied =
// -1600,      0,       7098.29833984375, -800,
// undefined, undefined, undefined, undefined,
// undefined, undefined, undefined, undefined,
// undefined, undefined, undefined, undefined
 
var allInversed = quat4.inverse(allMultiplied);  // War mal mat4.inv... hab ich aber editiert
// allInversed =
// -1600, 0, 7098.298490047455, -800,
//  undefined, ...
 
var multiplyWithPixel = mat4.multiply(pixel,allInversed);
// Ergebnis:
// 1348974.625, -3962098.25, 407098.3125, 847200
 

Jetzt kann das Ergebnis nicht ganz richtig sein. Weil y müsste eigentlich so um die 0 sein. und x so um die 2. z bei -9.
Ich benutze die glMatrix. Also Objekt habe ich einen Würfel an der Position [2,0,-10], mit der seitenlänge 2.

Ich hoffe ihr könnt mir helfen.

MfG
knosk

Zuletzt geändert von knosk am Do Jun 02, 2011 13:06, insgesamt 1-mal geändert.

Nach oben

Lord Horazont

Betreff des Beitrags: Re: Objekt auswählen (Picking)

Verfasst: Do Jun 02, 2011 12:40

DGL Member

Registriert: Do Sep 02, 2004 19:42
Beiträge: 4158
Programmiersprache: FreePascal, C++

Code:

var allInversed = mat4.inverse(allMultiplied);

Versuchst du da, einen Vektor zu invertieren? Denn allMultiplied sieht für mich, sowohl den Kommentaren als auch den Methodennamen nach, nach einem Vec4 aus.

greetings

_________________
If you find any deadlinks, please send me a notification – Wenn du tote Links findest, sende mir eine Benachrichtigung.
current projects: ManiacLab; aioxmpp
zombofant network • my photostream
„Writing code is like writing poetry“ - source unknown

„Give a man a fish, and you feed him for a day. Teach a man to fish and you feed him for a lifetime. “ ~ A Chinese Proverb

Nach oben

knosk

Betreff des Beitrags: Re: Objekt auswählen (Picking)

Verfasst: Do Jun 02, 2011 13:05

DGL Member

Registriert: Do Jun 02, 2011 11:49
Beiträge: 2

Upps, tut mir leid die Zeile müsste eigentlich

Code:

var allInversed = quat4.inverse(allMultiplied);

heißen. Sonst würde da ja nur NaN rauskommen. War anscheinend das CodeBeispiel nicht mehr ganz aktuell.

Nach oben

Coolcat

Betreff des Beitrags: Re: Objekt auswählen (Picking)

Verfasst: Do Jun 02, 2011 13:47

DGL Member

Registriert: Do Dez 29, 2005 12:28
Beiträge: 2249
Wohnort: Düsseldorf
Programmiersprache: C++, C#, Java

Ok, ich kenne glMatrix nicht, daher ganz langsam:

Code:

mat4.multiply(mvMatrix, pMatrix)

Das soll deine ModelViewProjection-Matrix sein, richtig?

Zitat:

mat4.multiplyVec4(mat4.multiply(mvMatrix, pMatrix), view);

view ist der Viewport-Vektor, diesen kannst du nicht einfach so auf eine Matrix anwenden, jedenfalls kommt wohl nicht das raus was du haben willst. Du musst dir aus dem Viewport-Vektor eine Matrix bauen und diese multiplizieren.

Code:

var allInversed = quat4.inverse(allMultiplied);

allMultiplied müsste eine Matrix sein....in deinem Code ist es ein Vektor......in jedem Fall aber kein Quaternion!! Quaternions helfen dir bei diesem Problem auch überhaupt nicht weiter da sie ausschließlich Rotation handhaben können. Du brauchst hier aber auf jeden Fall auch Translation und vor allem Projektion. Das geht nur mit 4x4 Matrizen.
=> mat4.inverse war schon richtig!

Code:

var pixel = quat4.create([mouseX,mouseY,0,1]);

Noch mehr Quaternion...das muss wenn überhaupt ein Vektor sein.

Code:

var multiplyWithPixel = mat4.multiply(pixel,allInversed);

Wie gesagt...ich kenne glMatrix nicht, aber ich würde sagen mat4.multiply erwartet zwei Matrizen als Input. Vermutlich wolltest du hier mat4.multiplyVec4 benutzen, aber auch das ist nicht das richtige. Es multipliziert den Vektor von rechts an die Matrix, du brauchst es hier aber von links. (Jedenfalls wenn ich mir den Code von glMatrix so anschaue)

----------

Übrigens ist das Ergebnis der Transformation der Cursorposition in den 3D-Raum zunächst erst mal kein Punkt sondern ein Strahl. Dieser Strahl zeigt von der Kamera durch den Cursor in die Szene hinein. Diesen Strahl müsstest du dann mit deinem Objekt schneiden um die genaue Position zu ermitteln. Du solltest dir also gut überlegen ob du wirklich die genaue Position benötigst oder ob es reicht zu wissen welches Objekt angeklickt wurde. Insbesondere bei komplexen Objekten ist Color-Picking die bessere Alternative. Dabei renderst du einfach alles mehr oder weniger normal, du kodierst aber eine Objekt-ID in die Farbe jedes Objekts. Dann brauchst du nur noch die Farbe des Pixels unter dem Cursor auslesen und zurück in eine Objekt-ID umwandeln. Schon hast du dein Objekt. Es gibt ein Tutorial dafür im Wiki, wenn auch nicht speziell für WebGL.

Hier Code von UltimateConquest bzw. WGT, findest du im Projekteforum. Ist ebenfalls WebGL, allerdings benutze ich GoogleWebToolkit d.h. ich programmiere in Java und überlasse es dann dem Compiler das zu JavaScript zu verwursten. Ich denke deine Fehler von oben zeigen deutlich warum eine Sprache wie Java mit fester Typprüfung ihre Vorteile hat!

Code:

    public Ray getCursorRay(Matrix44d proj, Matrix44d view, Vector2i cursor) {
        Vector2i viewport = WebGL.getInstance().getFramebufferSize();
        Vector2i revcur = viewport.sub(cursor);
        Vector3d v = new Vector3d(
            -(2*revcur.x/(double)viewport.x - 1.0) / proj._00,
             (2*revcur.y/(double)viewport.y - 1.0) / proj._11,
             -1
        );
        Matrix44d invView = view.getOrthonormalInverse(); // schnellere Matrix-Invertierung die einen bei mir 
                                                          // auftretenden Spezialfall ausnutzt....nimm hier die normale
                                                          // Matrix-Inverse, wenn du nicht weißt was du da tust.
        Ray ray = new Ray();
        ray.dir.x = v.x*invView._00 + v.y*invView._10 + v.z*invView._20;
        ray.dir.y = v.x*invView._01 + v.y*invView._11 + v.z*invView._21;
        ray.dir.z = v.x*invView._02 + v.y*invView._12 + v.z*invView._22;
        ray.dir.normalize();
        ray.origin = invView.getW(); // gibt _30, _31, _32 als Vector3d zurück
        return ray;
    }

_________________
Yeah! :mrgreen:

Nach oben

Seite 1 von 1

[ 4 Beiträge ]

Foren-Übersicht » Programmierung » Einsteiger-Fragen

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 7 Gäste

Du darfst keine neuen Themen in diesem Forum erstellen.
Du darfst keine Antworten zu Themen in diesem Forum erstellen.
Du darfst deine Beiträge in diesem Forum nicht ändern.
Du darfst deine Beiträge in diesem Forum nicht löschen.
Du darfst keine Dateianhänge in diesem Forum erstellen.