Hopiu/fabric.js
1
0
Fork 0
mirror of https://github.com/Hopiu/fabric.js.git synced 2026-05-04 20:04:45 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fixes a particular case of clipPath problem (#5477)

Browse source
This commit is contained in:
Andrea Bogazzi 2019-01-13 12:13:03 +01:00 committed by GitHub
parent 1cf38e1886
commit 03b98a0678
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 21 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/shapes/object.class.js
View file

@ -1175,8 +1175,10 @@
* @param {CanvasRenderingContext2D} ctx Context to render on
*/
drawObject: function(ctx, forClipping) {
var originalFill = this.fill, originalStroke = this.stroke;
if (forClipping) {
this.fill = 'black';
this.stroke = '';
this._setClippingProperties(ctx);
}
else {
@ -1186,6 +1188,8 @@
}
this._render(ctx);
this._drawClipPath(ctx);
this.fill = originalFill;
this.stroke = originalStroke;
},
_drawClipPath: function(ctx) {

16
test/visual/clippath.js
View file

@ -48,6 +48,22 @@
percentage: 0.06,
});
function clipping02(canvas, callback) {
var clipPath = new fabric.Circle({ radius: 50, strokeWidth: 40, top: -50, left: -50, fill: '' });
var obj = new fabric.Rect({ top: 0, left: 0, strokeWidth: 0, width: 200, height: 200, fill: 'rgba(0,255,0,0.5)'});
obj.clipPath = clipPath;
canvas.add(obj);
canvas.renderAll();
callback(canvas.lowerCanvasEl);
}
tests.push({
test: 'falsy values for fill are handled',
code: clipping02,
golden: 'clipping01.png',
percentage: 0.06,
});
function clipping1(canvas, callback) {
var zoom = 20;
canvas.setZoom(zoom);