mirror/html2canvas
1
0
Fork 0
mirror of https://github.com/niklasvh/html2canvas.git synced 2023-08-10 21:13:10 +03:00
Code Issues Projects Releases Wiki Activity

fix: background images should not be blurry in export

Browse Source
This commit is contained in:
zhbhun 2023-08-06 23:54:44 +08:00
parent 6020386bbe
commit 75c3ea4e51
1 changed files with 18 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/render/canvas/canvas-renderer.ts
View File

@ -600,11 +600,24 @@ export class CanvasRenderer extends Renderer {
image.height, image.height,
image.width / image.height image.width / image.height
]); ]);
const pattern = this.ctx.createPattern( // const pattern = this.ctx.createPattern(
this.resizeImage(image, width, height), // this.resizeImage(image, width, height),
'repeat' // 'repeat'
) as CanvasPattern; // ) as CanvasPattern;
this.renderRepeat(path, pattern, x, y); // this.renderRepeat(path, pattern, x, y);
const scaleX = width / image.naturalWidth;
const scaleY = height / image.naturalHeight;
const pattern = this.ctx.createPattern(image, "repeat") as CanvasPattern;
const scaledPath = (path as Vector[]).map((item) => {
item.x = item.x / scaleX;
item.y = item.y / scaleY;
return item;
});
const scaledOffsetX = x / scaleX;
const scaledOffsetY = y / scaleY;
this.ctx.scale(scaleX, scaleY);
this.renderRepeat(scaledPath, pattern, scaledOffsetX, scaledOffsetY);
this.ctx.scale(1 / scaleX, 1 / scaleY);
} }
} else if (isLinearGradient(backgroundImage)) { } else if (isLinearGradient(backgroundImage)) {
const [path, x, y, width, height] = calculateBackgroundRendering(container, index, [null, null, null]); const [path, x, y, width, height] = calculateBackgroundRendering(container, index, [null, null, null]);