diff --git a/lib/pen.js b/lib/pen.js index cb0d980..d749c33 100644 --- a/lib/pen.js +++ b/lib/pen.js @@ -292,6 +292,11 @@ export default class Painter { x: view.css && view.css.right ? (x - width) : x, y }; + const pd = this._doPaddings(view); + view.rect.left = view.rect.left - pd[3]; + view.rect.top = view.rect.top - pd[0]; + view.rect.right = view.rect.right + pd[1]; + view.rect.bottom = view.rect.bottom + pd[2]; this.ctx.rotate(angle); if (!notClip && view.css && view.css.borderRadius && view.type !== 'rect') { @@ -311,16 +316,8 @@ export default class Painter { }; } - // 画文字的背景图片 - _doBackground(view) { - this.ctx.save(); + _doPaddings(view) { const { - width: rawWidth, - height: rawHeight, - } = this._preProcess(view, true); - - const { - background, padding, } = view.css; let pd = [0, 0, 0, 0]; @@ -349,8 +346,24 @@ export default class Painter { pd = [x, y, z, a]; } } + return pd; + } + + // 画文字的背景图片 + _doBackground(view) { + this.ctx.save(); + const { + width: rawWidth, + height: rawHeight, + } = this._preProcess(view, true); + + const { + background, + } = view.css; + let pd = this._doPaddings(view); const width = rawWidth + pd[1] + pd[3]; const height = rawHeight + pd[0] + pd[2]; + this._doClip(view.css.borderRadius, width, height) if (GD.api.isGradient(background)) { GD.api.doGradient(background, width, height, this.ctx);