Cocos2d-x - Lỗi vẽ đường cong bezier khối

Question

Tôi đang cố gắng vẽ một đường bezier khối với độ dày nhất định, nhưng đường cong xuất hiện giống như một chuỗi các đoạn bị ngắt kết nối (3 trong trường hợp của tôi). Đây là một ảnh chụp màn hình (các vòng tròn màu xanh lam là các điểm điều khiển của đường cong).

tôi nhận thấy rằng tác dụng tương tự xảy ra trong 'vẽ nguyên thủy' trong các bài kiểm tra cocos2d-x. Dù sao thì tôi cũng khá chắc là có một cách giải quyết nhưng tôi không thể tự mình tìm được nó. Ngoài ra dòng bị ảnh hưởng bởi hiệu ứng răng cưa và tôi không chắc chắn cách áp dụng bóng alpha để tránh nó.

Đây là mã tôi đã sử dụng:

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

Đó hiệu lực bị hỏng là do thiếu đường nối giữa điểm cuối của dải dòng.

OpenGL được thiết kế để nhanh chóng quét rasterization trước hết và không phải lúc nào cũng đẹp như vậy nếu bạn muốn sử dụng theo cách này.

Có thể nhanh chóng và dơ bẩn cách workaround để loại được một kết quả hợp lý, giống như vẽ những vòng tròn tại điểm cuối để cố gắng lấp đầy mọi thứ trong

Một thư viện đúng nơi vẽ con đường đẹp là quan trọng sẽ thường xuyên cung cấp tham gia. các tùy chọn giữa các đường/đường cong như hình tròn, vát hoặc hình chữ Viter cùng với các tùy chọn cho mũ kết thúc nơi các đoạn không nối với nhau. Nó có thể dễ dàng và hiệu quả hơn cho loại công việc bạn đang làm để sử dụng, nói, một Rasterizer phong nha SVG cho loại công việc này. Nếu bạn cần kết hợp các kết quả trên các phần tử được OGL rasterized, bạn có thể chuyển kết quả hình ảnh thành kết cấu và hiển thị kết quả đó.

Bạn cũng có thể nhận được khá phức tạp và cuộn một giải pháp khá tinh vi (hoặc có thể tìm thấy một nơi khác) thông qua OpenGL. Dưới đây là ví dụ: https://www.mapbox.com/blog/drawing-antialiased-lines/

Answer 2

tôi có một giải pháp khác, nhưng tôi không biết liệu nó có làm cho hiệu suất hoạt động chậm không? bất cứ ai xin vui lòng cho tôi tư vấn !!

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); 


} 

đây là kết quả của tôi