diff --git a/src/item/Group.js b/src/item/Group.js index 98c91c00..9df3b6f7 100644 --- a/src/item/Group.js +++ b/src/item/Group.js @@ -167,9 +167,9 @@ var Group = this.Group = Item.extend(/** @lends Group# */{ draw: function(ctx, param) { var clipItem = this._getClipItem(); if (clipItem) { - param.clipping = true; + param.clip = true; Item.draw(clipItem, ctx, param); - delete param.clipping; + delete param.clip; } for (var i = 0, l = this._children.length; i < l; i++) { var item = this._children[i]; diff --git a/src/item/Item.js b/src/item/Item.js index 50186be7..f4f80205 100644 --- a/src/item/Item.js +++ b/src/item/Item.js @@ -2821,25 +2821,22 @@ var Item = this.Item = Base.extend(Callback, { ctx = CanvasProvider.getContext( bounds.getSize().ceil().add(Size.create(1, 1))); } - if (!param.clipping) - ctx.save(); + ctx.save(); // Translate the context so the topLeft of the item is at (0, 0) // on the temporary canvas. if (parentCtx) ctx.translate(-itemOffset.x, -itemOffset.y); // Keep calculating the current global matrix, by keeping a history // and pushing / popping as we go along. - var transforms = param.transforms, - global = transforms[transforms.length - 1].clone().concatenate( - item._matrix); - param.transforms.push(item._globalMatrix = global); + var transforms = param.transforms; + transforms.push(item._globalMatrix = transforms[transforms.length-1] + .clone().concatenate(item._matrix)); item._matrix.applyToContext(ctx); item.draw(ctx, param); - if (!param.clipping) { - param.transforms.pop(); - ctx.restore(); - - } + transforms.pop(); + ctx.restore(); + if (param.clip) + ctx.clip(); // If a temporary canvas was created before, composite it onto the // parent canvas: if (parentCtx) { diff --git a/src/path/CompoundPath.js b/src/path/CompoundPath.js index 755c0284..04555f7b 100644 --- a/src/path/CompoundPath.js +++ b/src/path/CompoundPath.js @@ -204,9 +204,7 @@ var CompoundPath = this.CompoundPath = PathItem.extend(/** @lends CompoundPath# for (var i = 0, l = children.length; i < l; i++) Item.draw(children[i], ctx, param); param.compound = false; - if (param.clip || this._clipMask) { - ctx.clip(); - } else { + if (!param.clip) { this._setStyles(ctx); if (style._fillColor) ctx.fill(); diff --git a/src/path/Path.js b/src/path/Path.js index 90941c3d..9b07863e 100644 --- a/src/path/Path.js +++ b/src/path/Path.js @@ -1841,21 +1841,18 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{ strokeColor = style._strokeColor, dashArray = style._dashArray, drawDash = !paper.support.nativeDash && strokeColor - && dashArray && dashArray.length, - clip = param.clip || this._clipMask; + && dashArray && dashArray.length; // Prepare the canvas path if we have any situation that requires it // to be defined. - if (param.compound || clip || fillColor || strokeColor + if (param.compound || param.clip || fillColor || strokeColor && !drawDash) drawSegments(ctx, this); if (this._closed) ctx.closePath(); - if (clip) { - ctx.clip(); - } else if (!param.compound && (fillColor || strokeColor)) { + if (!param.clip && !param.compound && (fillColor || strokeColor)) { // If the path is part of a compound path or doesn't have a fill // or stroke, there is no need to continue. this._setStyles(ctx);