AkkomaGang
/
akkoma-fe
4
13
Fork 56
Code Issues 71 Pull Requests 16 Projects Releases 1 Wiki Activity

Aligning canvas to image

This commit is contained in:
Mergan 2023-09-12 04:08:47 -07:00
parent 345934c2f3
commit 3947aafeba
1 changed files with 6 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/still-image/still-image.js
View File

@ -144,10 +144,14 @@ const StillImage = {
// Use requestAnimationFrame to schedule the scaling to the next frame
requestAnimationFrame(() => {
// Compute scaling ratio between the natural dimensions of the image and its display dimensions
const scalingRatioWidth = parentElement.clientWidth / image.naturalWidth;
const scalingRatioHeight = parentElement.clientHeight / image.naturalHeight;
// Adjust for high-DPI displays
const ratio = window.devicePixelRatio || 1;
canvas.width = parentElement.clientWidth * ratio;
canvas.height = parentElement.clientHeight * ratio;
canvas.width = image.naturalWidth * scalingRatioWidth * ratio;
canvas.height = image.naturalHeight * scalingRatioHeight * ratio;
canvas.style.width = `${parentElement.clientWidth}px`;
canvas.style.height = `${parentElement.clientHeight}px`;
context.scale(ratio, ratio);