Fabric.js使用椭圆作为剪裁形状

时间:2018-02-14 15:16:57

标签: javascript canvas fabricjs mask clipping

我有点努力让ellins在fabric.js中工作。 然后我想用它作为剪辑。

表示普通矩形

fabric.Image.fromURL(url, (asset) => {
   left: 0,
   right: 0,
   scaleX: 100 / asset.width,
   height: 100 / asset.height,
   clipTo: function(ctx) {
     ctx.save();
     ctx.setTransform(1,0,0,1,0,0);
     ctx.rect(0,0, 100, 100);
     ctx.stroke();
     ctx.restore();
   }
});

我发现它很棒,它允许开箱即用于在剪贴蒙版内移动图像。我想用省略号做这个,但是很难让它工作。我已经尝试了一个圆弧并对其进行了缩放,但随后内容将随之缩放。

我也很想知道是否可以做这样的事情。 我无法让它发挥作用。

fabric.Ellipses({
    left:100,
    top: 100,
    stroke: 'black',
    fill: 'white',
    selectable: true,
    originX: 'center', 
    originY: 'center',
    rx: 50,
    ry: 100
});

asset.clipTo(ctx) => {
   asset.render(ctx);
}

或者可能是另一种方式......

0 个答案:

没有答案