我在 Fabric.js 中绘制了一个 Canvas ,我正在向其中添加一组矩形,我想将这些矩形的边缘限制为一组,使其不超出特定区域。
想象一下制作一件条纹 T 恤,条纹是使用一系列矩形制成的,我需要将它们保持在 T 恤的形状上。
我认为最好将整个 Canvas 夹在 T 恤的形状上,这样我添加到它的任何东西都会保留在 T 恤内,但我被卡住了。到目前为止,我只剪裁到基本的圆形和矩形。
谢谢
最佳答案
您可以在 canvas.clipTo
中渲染一个形状 :)
我刚刚在 kitchensink 中加载了一个随机的 SVG 形状并这样做:
var shape = canvas.item(0);
canvas.remove(shape);
canvas.clipTo = function(ctx) {
shape.render(ctx);
};
如您所见,整个 Canvas 现在都被该 SVG 形状裁剪了。
关于javascript - Fabric.js 裁剪 Canvas (或对象组)到多边形,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18816753/