Cocos2d-x - Fehler beim Zeichnen von kubischen Bezier-Kurven

Question

Ich versuche, einen kubischen Bezier Pfad mit einer bestimmten Dicke zu zeichnen, aber die Kurve erscheint wie eine Sequenz von getrennten Segmenten (3 in meinem Fall). Dies ist ein Screenshot (die blauen Kreise sind die Kontrollpunkte der Kurve).

bemerkte ich, dass der gleiche Effekt tritt in dem 'ziehen Primitiven' in den cocos2d-x-Tests. Ich bin mir ziemlich sicher, dass es einen Workaround geben sollte, aber ich bin nicht in der Lage, es selbst zu finden. Außerdem ist die Linie vom Aliasing-Effekt betroffen und ich bin mir nicht sicher, wie ich einen Alpha-Schatten anwenden soll, um es zu vermeiden.

Dies ist der Code, den ich verwenden:

glLineWidth(24.0f); 

Vec2 cp1 = Vec2(200, 200); 
Vec2 cp2 = Vec2(1300, 150); 
Vec2 cp3 = Vec2(170, 1200); 
Vec2 cp4 = Vec2(1400, 1000); 

//Draw control points 
DrawPrimitives::setDrawColor4B(0, 0, 255, 255); 
DrawPrimitives::drawSolidCircle(cp1, 50, 360, 120, 1, 1); 
DrawPrimitives::drawSolidCircle(cp2, 50, 360, 120, 1, 1); 
DrawPrimitives::drawSolidCircle(cp3, 50, 360, 120, 1, 1); 
DrawPrimitives::drawSolidCircle(cp4, 50, 360, 120, 1, 1); 

//Draw cubic red bezier curve 
DrawPrimitives::setDrawColor4B(255, 0, 0, 255); 
DrawPrimitives::drawCubicBezier(cp1, cp2, cp3, cp4, 50); 

Answer 1

Die gebrochene Effekt durch einen Mangel an Pfad zwischen Endpunkten des Linienstreife Beitritt verursacht wird.

OpenGL ist in erster Linie für schnelle Rasterlinienrasterung ausgelegt und ist nicht immer so schön, wenn Sie es auf diese Weise verwenden möchten.

Es könnte schnell und schmutzig Abhilfe Möglichkeiten, um Art ein vernünftiges Ergebnis zu erhalten, wie die Kreise an den Endpunkten zeichnen zu versuchen, die Dinge zu füllen.

Eine richtige Bibliothek, wo oft Pfade schön ist wichtig, zeichnen bieten beitreten Optionen zwischen Linien/Kurven wie abgerundet, abgeschrägt oder eine Gehrung mit Optionen für die Endkappen, wo Segmente nicht zusammenfügen. Es könnte einfacher und effizienter genug für die Art von Arbeit sein, die Sie verwenden, sagen wir, einen anständigen SVG-Rasterizer für diese Art von Arbeit. Wenn Sie die Ergebnisse über Elemente gruppieren müssen, die von OGL gerastert wurden, können Sie die Bildergebnisse in eine Textur übertragen und diese rendern.

Sie könnten auch ziemlich aufwändig und rollen eine ziemlich anspruchsvolle Lösung (oder möglicherweise woanders finden) über OpenGL. Hier ist ein Beispiel: https://www.mapbox.com/blog/drawing-antialiased-lines/

Answer 2

Ich habe eine andere Lösung, aber ich weiß nicht, ob es die Leistung verlangsamen? jemand bitte geben Sie mir beraten !!

void DrawNode::drawCubicBezier(const Vec2 &origin, const Vec2 &control1, const Vec2 &control2, const Vec2 &destination, unsigned int segments, const Color4F &color) 

{ 

Vec2* vertices = new (std::nothrow) Vec2[segments + 1]; 
if(! vertices) 
    return; 

float t = 0; 
for (unsigned int i = 0; i < segments; i++) 
{ 
    vertices[i].x = powf(1 - t, 3) * origin.x + 3.0f * powf(1 - t, 2) * t * control1.x + 3.0f * (1 - t) * t * t * control2.x + t * t * t * destination.x; 
    vertices[i].y = powf(1 - t, 3) * origin.y + 3.0f * powf(1 - t, 2) * t * control1.y + 3.0f * (1 - t) * t * t * control2.y + t * t * t * destination.y; 

    t += 1.0f/segments; 
    **///begin adddd 
    drawLine(Vec2(vertices[i].x, vertices[i].y - 3), Vec2(vertices[i].x, vertices[i].y + 3), color); 
    /// end addddd** 
} 
vertices[segments].x = destination.x; 
vertices[segments].y = destination.y; 
**drawLine(Vec2(vertices[segments].x, vertices[segments].y - 3), Vec2(vertices[segments].x, vertices[segments].y + 3), color);** 

CC_SAFE_DELETE_ARRAY(vertices); 


} 

hier mein Ergebnis ist