Automattic / Automattic/node-canvas

SVG not scaling with context

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

Description

## Issue or Feature
I'm not sure if i opened this issue already, or just commented in the old svg resize issue that i cannot find anymore.

In browser canvas SVGs are resized and re rendered with the context scale other than the width and height assigned.

In node canvas rendering a svg on a scaled context gives blurred results.

## Steps to Reproduce

```js
const fs = require('fs');
const { createCanvas, loadImage } = require('canvas')
const canvas = createCanvas(500, 500)
const ctx = canvas.getContext('2d');

ctx.scale(20, 20);

loadImage('http://thenewcode.com/assets/images/thumbnails/homer-simpson.svg').then((image) => {
ctx.drawImage(image, 100, 100, 400, 400, 0, 0, 500, 500);
var stream = canvas.createPNGStream();
stream.pipe(fs.createWriteStream('output.png'));
})
```

![image](https://user-images.githubusercontent.com/1194048/65475687-b081fd80-de80-11e9-8e55-80713868bac7.png)

## Your Environment
* Version of node-canvas (output of `npm list canvas` or `yarn list canvas`):
* Environment (e.g. node 10.0.0 on Mac OS X 10.8):

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.