Question

我似乎无法高质量地填充我在PixiJS中构建的形状。

https://codepen.io/mvalentin06-the-sasster/pen/oNgvvqo

function setup() { //building the shapes

var mid_x = renderer.width / 2; //middle X axis
var mid_y = renderer.height / 2;//middle Y axis
var maxAngle = 2 * Math.PI / 3; //120 degrees angle
var lastAngle = 0;  //sum of prev angles
var cnt = 0;  //counting the current image

while (lastAngle < Math.PI * 2) {  //while it aint a full circle
    var g = new PIXI.Graphics();    //new shape

    g.beginTextureFill(imgs[cnt]);//fill with image

    g.lineStyle(4, 0x000000);       //line style
    g.moveTo(mid_x, mid_y);         //move everything on center
    sections.push(g);               //add to the half-circle list

    g.arc(mid_x, mid_y, radius, lastAngle, lastAngle + maxAngle, false);    //draw half-circle
    cnt += 1;
    stage.addChild(g);  //add to stage
    lastAngle += maxAngle;  //add the angle to the angle sums
}

我有一个三分之三的圆角按摩器，想要给每个图像填充一个图像，但这从来都不是高质量的外观。当图像太接近圆形大小时，它要么偏离中心要么错误。因此，调整图像本身的大小并没有任何改善的迹象。

我还尝试了诸如Adobe套件中的蒙版工作原理之类的方法，但是我什至无法获得形状的边缘坐标。我总是从-infinity到+ infinity。

有什么想法吗？预先谢谢你！

PixiJS用图像填充形状

0 个答案: