diff --git a/src/core/graphics/webgl/utils/buildCircle.js b/src/core/graphics/webgl/utils/buildCircle.js index cbcf1bd..06c35e9 100644 --- a/src/core/graphics/webgl/utils/buildCircle.js +++ b/src/core/graphics/webgl/utils/buildCircle.js @@ -82,7 +82,7 @@ graphicsData.points = []; - for (let i = 0; i < totalSegs + 1; i++) + for (let i = 0; i < totalSegs; i++) { graphicsData.points.push( x + (Math.sin(seg * -i) * width), @@ -90,6 +90,11 @@ ); } + graphicsData.points.push( + graphicsData.points[0], + graphicsData.points[1] + ); + buildLine(graphicsData, webGLData, webGLDataNativeLines); graphicsData.points = tempPoints; diff --git a/src/core/graphics/webgl/utils/buildCircle.js b/src/core/graphics/webgl/utils/buildCircle.js index cbcf1bd..06c35e9 100644 --- a/src/core/graphics/webgl/utils/buildCircle.js +++ b/src/core/graphics/webgl/utils/buildCircle.js @@ -82,7 +82,7 @@ graphicsData.points = []; - for (let i = 0; i < totalSegs + 1; i++) + for (let i = 0; i < totalSegs; i++) { graphicsData.points.push( x + (Math.sin(seg * -i) * width), @@ -90,6 +90,11 @@ ); } + graphicsData.points.push( + graphicsData.points[0], + graphicsData.points[1] + ); + buildLine(graphicsData, webGLData, webGLDataNativeLines); graphicsData.points = tempPoints; diff --git a/test/core/Graphics.js b/test/core/Graphics.js index 0300129..23c277c 100644 --- a/test/core/Graphics.js +++ b/test/core/Graphics.js @@ -284,4 +284,42 @@ } })); }); + + describe('drawCircle', function () + { + it('should have no gaps in line border', withGL(function () + { + const renderer = new PIXI.WebGLRenderer(200, 200, {}); + + try + { + const graphics = new PIXI.Graphics(); + + graphics.lineStyle(15, 0x8FC7E6); + graphics.drawCircle(100, 100, 30); + + renderer.render(graphics); + + const points = graphics._webGL[renderer.CONTEXT_UID].data[0].points; + const pointSize = 6; // Position Vec2 + Color/Alpha Vec4 + const firstX = points[0]; + const firstY = points[1]; + const secondX = points[pointSize]; + const secondY = points[pointSize + 1]; + const secondToLastX = points[points.length - (pointSize * 2)]; + const secondToLastY = points[points.length - (pointSize * 2) + 1]; + const lastX = points[points.length - pointSize]; + const lastY = points[points.length - pointSize + 1]; + + expect(firstX).to.equals(secondToLastX); + expect(firstY).to.equals(secondToLastY); + expect(secondX).to.equals(lastX); + expect(secondY).to.equals(lastY); + } + finally + { + renderer.destroy(); + } + })); + }); });