[有人在使用Pixi绘制空心圆上有经验吗?我的当前方法仅在WebGL渲染器中有效,这使我认为它存在缺陷,我还需要回退到其他设备上的其他渲染。
this.mathPiDub = 2 * Math.PI;
this.color = 0xFF00FF
var nuRad = 10;
this.pixiCircle.beginFill(this.color, 1);
this.pixiCircle.arc(0, 0, nuRad - 2, 0, this.mathPiDub, false);
this.pixiCircle.arc(0, 0, nuRad, 0, this.mathPiDub, false);
this.pixiCircle.endFill();
[2D渲染给了我一个完整的圆圈,而WebGL则贯穿了整个洞。
最佳方法是什么?
drawCircle()
与lineStyle
一起使用,而不是填充。this.pixiCircle = new PIXI.Graphics();
this.pixiCircle.lineStyle(2, 0xFF00FF); //(thickness, color)
this.pixiCircle.drawCircle(0, 0, 10); //(x,y,radius)
this.pixiCircle.endFill();
stage.addChild(this.pixiCircle);
这将同时适用于WebGL和Canvas渲染器
beginHole()
和endHole()
方法: function createHollowCircle(radius, x_coordinate, y_coordinate) {
let circle = new Graphics();
circle.beginFill(color);
circle.drawCircle(0, 0, radius);
circle.beginHole();
circle.drawCircle(0, 0, radius - 0.1);
circle.endHole();
circle.endFill();
circle.x = x_coordinate;
circle.y = y_coordinate;
return circle;
}
Hollow Circles