Source code
Revision control
Copy as Markdown
Other Tools
function resizeToPixelGrid(canvas) {
return new Promise(resolve => {
new ResizeObserver(entries => {
canvas.width = entries[0].devicePixelContentBoxSize[0].inlineSize;
canvas.height = entries[0].devicePixelContentBoxSize[0].blockSize;
setTimeout(resolve);
}).observe(canvas);
});
}
function computeScaledDestinationSize(cvs, target, scaleX, scaleY, outsetWidth, outsetHeight) {
let targetWidth, targetHeight;
outsetWidth = outsetWidth || 0;
outsetHeight = outsetHeight || 0;
if (target instanceof Element) {
if (getComputedStyle(target).boxSizing != "border-box") {
throw new TypeError("'box-sizing:border-box' is required to compute" +
" accurate destination size.");
}
const canvasScaleX = cvs.width / cvs.clientWidth;
const canvasScaleY = cvs.height / cvs.clientHeight;
const style = getComputedStyle(target);
targetWidth = canvasScaleX * (Number.parseFloat(style.width) + outsetWidth);
targetHeight = canvasScaleY * (Number.parseFloat(style.height) + outsetHeight);
}
if (target instanceof ImageData) {
targetWidth = target.width;
targetHeight = target.height;
}
return [Math.ceil(targetWidth * scaleX), Math.ceil(targetHeight * scaleY)];
}
function computeExplicitDestinationSize(cvs, scaleX, scaleY, swidth, sheight) {
const targetWidth = scaleX * swidth;
const targetHeight = scaleY * sheight;
// Scale factor from CSS pixels to canvas grid.
const canvasScaleX = cvs.width / cvs.clientWidth;
const canvasScaleY = cvs.height / cvs.clientHeight;
// Destination size in canvas grid
const destWidth = Math.ceil(targetWidth * canvasScaleX);
const destHeight = Math.ceil(targetHeight * canvasScaleY);
return [destWidth, destHeight];
}
export { resizeToPixelGrid,
computeScaledDestinationSize,
computeExplicitDestinationSize };