DGL • Thema anzeigen - Kreis + Texture

Kreis + Texture

Moderator: DGL-Team

Seite 1 von 1

[ 13 Beiträge ]

Vorheriges Thema | Nächstes Thema

Autor

Nachricht

rswhite

Betreff des Beitrags: Kreis + Texture

Verfasst: Mo Nov 11, 2013 16:47

DGL Member

Registriert: Di Dez 13, 2011 19:14
Beiträge: 166
Wohnort: Hamburg / Mölln
Programmiersprache: D

Ich nochmal.
Ich habe eine etwas andere Frage die sich mir spontan stellte.
Wie ich eine Texture auf z.B. ein Quadrat mappe ist mir kein großes Rätsel. Auch ein Dreieck ist klar, aber wie mappe ich eine Textur auf etwas mehreckiges, z.B. auf einen Kreis? Ich kann mir das leider irgendwie überhaupt nicht vorstellen.

Ich habe z.B. hier meine Schleife, mit der ich die Vertices für vecNum (im Normalfall 30) Vertices berechnen lasse:

Code:

 
const float Deg2Rad = (PI * 2) / vecNum;
 
for (ubyte i = 0; i < vecNum; i++) {
    float degInRad = i * Deg2Rad;
    
    float x = center.x + cos(degInRad) * radius;
    float y = center.y + sin(degInRad) * radius;
 
}

Das funktioniert auch prima. Aber wie würde ich jetzt dort die Textur Koordinaten berechnen? o.O
Wäre super wenn mir das jemand erklären könnte. Ich würde echt gerne wissen, wie man eine Textur auf einen Kreis oder auch ein Sechseck zeichnet.

Nach oben

glAwesome

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 17:08

DGL Member

Registriert: Mi Aug 14, 2013 21:17
Beiträge: 588
Programmiersprache: C++

Das kommt natürlich darauf an, wie deine Textur aussieht. Wenn auf der (quadratischen) Textur ebenfalls ein Kreis zu sehen ist, dann kannst du die Texturkoordinaten ganz analog mit sin und cos berechnen.

_________________
So aktivierst du Syntaxhighlighting im Forum: [code=pascal ][/code], [code=cpp ][/code], [code=java ][/code] oder [code=glsl ][/code] (ohne die Leerzeichen)

Nach oben

rswhite

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 17:17

DGL Member

Registriert: Di Dez 13, 2011 19:14
Beiträge: 166
Wohnort: Hamburg / Mölln
Programmiersprache: D

Ich benutz zu Testzwecken gerne euer Logo. Also nehmen wir an, die Textur wäre quadratisch und ich möchte einen beliebigen Teil davon.

Ich hatte es auch schon probiert mit sinus und cosinus, aber das scheint nicht zu klappen. Ich hatte in jedem Durchlauf für Texturekoordinaten einfach das hier gemacht:

Code:

 
float tx = cos(degInRad) * radius;
float ty = sin(degInRad) * radius;

Nach oben

glAwesome

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 17:33

DGL Member

Registriert: Mi Aug 14, 2013 21:17
Beiträge: 588
Programmiersprache: C++

rswhite hat geschrieben:

Ich benutz zu Testzwecken gerne euer Logo.

Wieso "euer"? Ich denke, mit 141 Posts darfst du dich gerne als Teil der Community sehen.

Aber zurück zum Thema:
Folgender Code sollte genau tun, was du willst:

Code:

float tx = center.x + cos(degInRad) * radius;
float ty = center.y + sin(degInRad) * radius;

Es gilt nur noch, die Parameter richtig zu setzen. Angenommen, der Kreis soll sich in der Mitte der quadratischen Textur befinden und den selben Durchmesser haben, wie die Textur breit ist (siehe angehängtes Bild) - als 1.0 in Texturkoordinaten. Der Radius wäre dann natürlich 0.5. Als center solltest du ebenfalls vec2(0.5) wählen, damit der Kreis in der Mitte der Textur seinen Mittelpunkt hat.

Du hast keine ausreichende Berechtigung, um die Dateianhänge dieses Beitrags anzusehen.

_________________
So aktivierst du Syntaxhighlighting im Forum: [code=pascal ][/code], [code=cpp ][/code], [code=java ][/code] oder [code=glsl ][/code] (ohne die Leerzeichen)

Nach oben

rswhite

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 17:51

DGL Member

Registriert: Di Dez 13, 2011 19:14
Beiträge: 166
Wohnort: Hamburg / Mölln
Programmiersprache: D

Klingt einleuchtend. Leider scheint es nicht zu klappen.
Hier mal mein jetziger Code-Stand:

Code:

 
const float Deg2Rad = PIx2 / vecNum;
 
Vector2f tcenter = Vector2f(0.5f, 0.5f);
float tradius = 0.5f;
 
for (ubyte i = 0; i < vecNum; i++) {
    float degInRad = i * Deg2Rad;
    
    float x = center.x + cos(degInRad) * radius;
    float y = center.y + sin(degInRad) * radius;
 
    Vertex v = Vertex(x, y);
 
    v.tx = tcenter.x + cos(degInRad) * tradius;
    v.ty = tcenter.y + sin(degInRad) * tradius;
}
 

Ich hab mir auch alle 30 mal ausgeben lassen und besonders Nr. 16 sieht komisch aus, ich hab ihn mal markiert.
Ein Vertex ist bei mir folgendermaßen ausgebaut: Die ersten 3 floats sind x, y, z (wobei z eig. immer 0f ist). Die nächsten 4 sind R, G, B und A Werte (Standardmäßig Schwarz = 0, 0, 0, 1) und die letzten beiden floats sind die eigentlichen Textur Koordinaten.

Zitat:

Vertex(205, 380, 0, 0, 0, 0, 1, 1, 0.5)
Vertex(204.454, 385.195, 0, 0, 0, 0, 1, 0.989085, 0.603904)
Vertex(202.841, 390.164, 0, 0, 0, 0, 1, 0.956816, 0.703271)
Vertex(200.23, 394.688, 0, 0, 0, 0, 1, 0.904602, 0.793764)
Vertex(196.736, 398.572, 0, 0, 0, 0, 1, 0.834723, 0.87143)
Vertex(192.511, 401.644, 0, 0, 0, 0, 1, 0.75023, 0.93288)
Vertex(187.741, 403.771, 0, 0, 0, 0, 1, 0.654811, 0.97543)
Vertex(182.632, 404.861, 0, 0, 0, 0, 1, 0.552634, 0.997222)
Vertex(177.408, 404.865, 0, 0, 0, 0, 1, 0.448158, 0.997305)
Vertex(172.297, 403.784, 0, 0, 0, 0, 1, 0.345946, 0.975676)
Vertex(167.523, 401.664, 0, 0, 0, 0, 1, 0.25046, 0.933278)
Vertex(163.293, 398.598, 0, 0, 0, 0, 1, 0.165869, 0.871963)
Vertex(159.793, 394.72, 0, 0, 0, 0, 1, 0.0958662, 0.794408)
Vertex(157.175, 390.2, 0, 0, 0, 0, 1, 0.0435083, 0.703999)
Vertex(155.554, 385.234, 0, 0, 0, 0, 1, 0.0110812, 0.604683)
Vertex(155, 380.04, 0, 0, 0, 0, 1, 6.34053e-07, 0.500796)
Vertex(155.538, 374.844, 0, 0, 0, 0, 1, 0.0107503, 0.396875)
Vertex(157.143, 369.873, 0, 0, 0, 0, 1, 0.0428609, 0.297456)
Vertex(159.747, 365.344, 0, 0, 0, 0, 1, 0.0949306, 0.206881)
Vertex(163.234, 361.455, 0, 0, 0, 0, 1, 0.164686, 0.129103)
Vertex(167.454, 358.376, 0, 0, 0, 0, 1, 0.249081, 0.067519)
Vertex(172.222, 356.241, 0, 0, 0, 0, 1, 0.344432, 0.0248173)
Vertex(177.329, 355.143, 0, 0, 0, 0, 1, 0.446575, 0.00286246
Vertex(182.552, 355.131, 0, 0, 0, 0, 1, 0.55105, 0.0026129)
Vertex(187.665, 356.204, 0, 0, 0, 0, 1, 0.653296, 0.0240795)
Vertex(192.442, 358.316, 0, 0, 0, 0, 1, 0.74885, 0.0663252)
Vertex(196.677, 361.375, 0, 0, 0, 0, 1, 0.833538, 0.127506)
Vertex(200.183, 365.247, 0, 0, 0, 0, 1, 0.903664, 0.204949)
Vertex(202.808, 369.764, 0, 0, 0, 0, 1, 0.956166, 0.295275)
Vertex(204.438, 374.727, 0, 0, 0, 0, 1, 0.988751, 0.394539)

Der Vollständigkeit halber:
Mein radius ist 25 und mein center ist Vector2f(180, 380).

Nach oben

glAwesome

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 18:17

DGL Member

Registriert: Mi Aug 14, 2013 21:17
Beiträge: 588
Programmiersprache: C++

Ist doch alles richtig. Der Vertex, den du markiert hast, ist der nach einer halben Umdrehung. Eigentlich müsste er so aussehen:

Zitat:

Vertex(155, 380, 0, 0, 0, 0, 1, 0, 0.5)

Durch Rundungsfehler weichen die tatsächlichen Ergebnisse minmal vom mathematisch korrekten ab. Diesen Effekt hat man immer, wenn man mit Fließkommazahlen arbeitet. 6.34053e-07 bedeutet: 6.34053 * 10^(-7) = 0.000000634053, also fast 0.

_________________
So aktivierst du Syntaxhighlighting im Forum: [code=pascal ][/code], [code=cpp ][/code], [code=java ][/code] oder [code=glsl ][/code] (ohne die Leerzeichen)

Nach oben

rswhite

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 18:25

DGL Member

Registriert: Di Dez 13, 2011 19:14
Beiträge: 166
Wohnort: Hamburg / Mölln
Programmiersprache: D

Hm, aber wieso sehe ich nichts? :/

edit:
Meine Schuld. Ich hatte 1. als Shape.Type LineLoop und zweitens die Farbe Schwarz, damit wurde 1. nur ein Runder Kreis ohne Füllung gezeichnet und 2. ein schwarz ausgefüllter Kreis. Mit Shape.Type.Polygon und weißer Farbe ist es ok und sieht so aus:
Bild

Doch es zieht gezerrt/gescaled aus. Lässt sich das beheben?

Nach oben

glAwesome

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 19:00

DGL Member

Registriert: Mi Aug 14, 2013 21:17
Beiträge: 588
Programmiersprache: C++

Ich weiß nicht, was du mit gezerrt/gescaled meint. Das Seitenverhältnis stimmt für mein Auge. Wenn du die Größe meinst, musst du natürlich einfach nur radius ändern.

_________________
So aktivierst du Syntaxhighlighting im Forum: [code=pascal ][/code], [code=cpp ][/code], [code=java ][/code] oder [code=glsl ][/code] (ohne die Leerzeichen)

Nach oben

rswhite

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 19:03

DGL Member

Registriert: Di Dez 13, 2011 19:14
Beiträge: 166
Wohnort: Hamburg / Mölln
Programmiersprache: D

Die Textur sieht gezerrt aus, als wäre sie für diese Größe angepasst worden. Ich dachte nicht das ein so kleiner Kreis den Titel des Logos komplett inne haben könnte.

Nach oben

glAwesome

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 19:31

DGL Member

Registriert: Mi Aug 14, 2013 21:17
Beiträge: 588
Programmiersprache: C++

Wie viel du von dem Logo siehst, stellst du ja mit den Texturkoordinaten ein. Also wenn du tradius verkleinerst, siehst du auch nur einen kleineren Ausschnitt der Textur.
Wie groß dieser Ausschnitt auf dem Bildschirm dargestellt wird, hängt dann wiederum (neben den Matrizen) vom radius ab. Du kannst ja mal mit den Werten etwas rumspielen, dann wirst du verstehen, was ich meine.

_________________
So aktivierst du Syntaxhighlighting im Forum: [code=pascal ][/code], [code=cpp ][/code], [code=java ][/code] oder [code=glsl ][/code] (ohne die Leerzeichen)

Nach oben

rswhite

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 21:02

DGL Member

Registriert: Di Dez 13, 2011 19:14
Beiträge: 166
Wohnort: Hamburg / Mölln
Programmiersprache: D

Ok, das probier ich später mal aus und frag sonst nochmal nach. Danke erstmal.

Aber es gibt ja mehrere Formen. Und sagen wir ich will einen bestimmten Ausschnitt einer Textur auf alle diese Formen mappen. Gibt es da nicht vielleicht eine Formel für?
Ich weiß den Form Typ, ich weiß wie viele Vertices es gibt, ich weiß welchen Ausschnitt der Texture ich haben möchte und ich habe die Textur und alle ihre Daten (Höhe, Breite, etc.).
Müsste es da nicht etwas geben, um automatisch für den jeweiligen Typ die passenden Textur Koordinaten zu berechnen?

Sagen wir ich habe das Logo: 140px Breit und Hoch. Und ich möchte den Ausschnitt (10, 10, 100, 100) zeichnen. Wie sähe da eine Formel aus, um für jeden Typ (Quad, Triangle, Kreis, Sechseck, Vieleck etc.) die Textur Koordinaten anzupassen? Ich müsste ja alle Vertices durchlaufen und ihre Textur Koordinaten anpassen. Aber wie.

edit:
Um meine Worte etwas bildlicher auszudrücken:
Bild

Die Textur Koordinaten automatisch transformieren von Links nach Rechts.

Nach oben

rswhite

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Mo Nov 11, 2013 23:59

DGL Member

Registriert: Di Dez 13, 2011 19:14
Beiträge: 166
Wohnort: Hamburg / Mölln
Programmiersprache: D

Ich hab' ein Programm geschrieben und es scheint auch zu funktionieren. nur leider ist es nicht gerade effizient.
Ich suche mir alle x und y minima und x und y maxima meiner Vertices heraus (und speicher sie als Array in xarr/yarr), errechne mir die Differenz und errechne daran die Textur Koordinaten.

Code:

 
    float x_max = max(xarr);
    float y_max = max(yarr);
 
    float x_min = min(xarr);
    float y_min = min(yarr);
 
    float diff_x = abs(x_max - x_min);
    float diff_y = abs(y_max - y_min);
 
    foreach (ref Vertex v; vs) {
        v.tx = ((v.x - diff_x) / diff_x);
        v.ty = ((v.y - diff_y) / diff_y);
    }
 

So entstehen aus:

Code:

 
    Vertex[] vs_quads = [
        Vertex(100, 150),   
        Vertex(200, 150),   
        Vertex(200, 250),   
        Vertex(100, 250)
    ];
 
    Vertex[] vs_six = [
        Vertex(100, 150),   
        Vertex(125, 100),   
        Vertex(175, 100),   
        Vertex(200, 150),   
        Vertex(175, 200),   
        Vertex(125, 200)
    ];
 

diese Ausgaben:

[Vertex(100, 150, 0, 0.5), Vertex(200, 150, 1, 0.5), Vertex(200, 250, 1, 1.5), Vertex(100, 250, 0, 1.5)]
und
[Vertex(100, 150, 0, 0.5), Vertex(125, 100, 0.25, 0), Vertex(175, 100, 0.75, 0), Vertex(200, 150, 1, 0.5), Vertex(175, 200, 0.75, 1), Vertex(125, 200, 0.25, 1)]

Allem Anschein nach erfolgreich. Aber gibt es keinen effizienteren Weg?

Nach oben

OpenglerF

Betreff des Beitrags: Re: Kreis + Texture

Verfasst: Di Nov 12, 2013 00:13

DGL Member

Registriert: Do Dez 29, 2011 19:40
Beiträge: 421
Wohnort: Deutschland, Bayern
Programmiersprache: C++, C, D, C# VB.Net

Ich persönlich verwende in meiner GUI relative Koordinaten. Ein Kreis(oder sogar Ellipse) hat bei mir unabhänig von der Größe oder der Skalierung Koordinaten von (0|0) bis (1|1). Die Größe oder Positionierung mache ich mit ganz normalen Matrizen. Der Vorteil an der Darstellung ist, dass man die Position direkt auch als Texturkoordinaten wiederverwenden kann und nichtmal extrige Vertexattribute braucht. Wenn deine Positionen nicht in einen bestimmten definierten Bereich liegen, wird es immer notwenig werden das Minimum oder Maximum zu bestimmen.

Nach oben

Seite 1 von 1

[ 13 Beiträge ]

Foren-Übersicht » Programmierung » Einsteiger-Fragen

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 5 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.