Automattic / Automattic/node-canvas

SVGs with size in mm are scaled down

Open
#2,331 0 comments 0 reactions 0 assignees View on GitHub
SVG
Dominant language
JavaScript
Stars
10.7k
Forks
1.2k
Avg merge
4d 8h
Merged PRs (30d)
1

Description

SVG images that have the width and height attribute in mm units instead of pixel units are scaled down

## Steps to Reproduce
```js
const { Image } = require("canvas");

const svgWithSizeInmm =
`
`;

const image1 = new Image();
image1.onload = () => {
console.log("Image with size in mm:");
console.log(image1.width); // prints 375
console.log(image1.height); // prints 94
}
image1.src = `data:image/svg+xml;base64,${btoa(svgWithSizeInmm)}`;

const svgWithSizeInPx =
`
`;

const image2 = new Image();
image2.onload = () => {
console.log("Image with size in pixels:");
console.log(image2.width); // prints 400
console.log(image2.height); // prints 100
}
image2.src = `data:image/svg+xml;base64,${btoa(svgWithSizeInPx)}`;
```
Expected results are that both images should have 400 width and 100 height
you can run it on a web browser to test and both will have 400 and 100 width and height

## Your Environment
canvas@2.11.2
nodejs version v20.10.0 on Linux

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by running the provided Node.js reproduction with node-canvas 2.11.2 and compare the Image dimensions for the millimetre and pixel SVGs. Trace the Image SVG-loading path and verify the result against a browser; done means the millimetre SVG reports 400 by 100, matching the pixel-sized SVG.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, node.js
Domain
computer-graphics
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.