[英]shape intersection with KineticJS
您可以使用globalCompositeOperation
来做到这一点: http : //jsfiddle.net/wbzwX/
ctx.fillStyle="#000";
ctx.fillRect(50,50,100,100);
ctx.globalCompositeOperation = "source-in";
// this will use the fillstyle of the next drawn object.
// "destination-in" will use the previous fillstyle.
ctx.beginPath();
ctx.arc(100,50,30,0,Math.PI*2,false);
ctx.closePath();
ctx.fillStyle="#f00";
ctx.fill();
我创建了基于Shmi的解决方案。
function makeShapeComposite(shape, operation) {
shape.attrs._drawFunc = shape.attrs.drawFunc;
shape.attrs.drawFunc = function (context) {
context.save();
context.globalCompositeOperation = operation;
this.attrs._drawFunc.call(this, context);
context.restore();
};
return shape;
};
var pol= makeShapeComposite(new Kinetic.RegularPolygon({
x: 250,
y: 100,
sides: 4,
radius: 70,
fill: '#00D2FF',
stroke: 'black',
strokeWidth: 2
}), "destination-in");
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.