elrumordelaluz / scale-that-svg

Scale that SVG!

Scale that svg, period.

Install

yarn add scale-that-svg

Usage

const { scale } = require('scale-that-svg')

fs.readFile('./test.svg', (err, input) => {
  scale(input, { scale: 0.5 }).then((scaled) => {
    console.log({ scaled })
  })
})

scale(`<svg viewBox="0 0 500 200">
  <rect
    x="200"
    y="50"
    fill="#F16362"
    stroke="#30456B"
    stroke-width="5"
    stroke-linecap="round"
    stroke-linejoin="round"
    width="100" height="100"/>
</svg>`).then((scaledFromString) => console.log({ scaledFromString }))

API

scale(input,[options])

input

Type: string|buffer SVG to scale

options

Type: Object Based on svg-path-tool scale

scale

Type: number
Default: 1 (no scale)

scaleY

Type: number
If no specified, same as scale

round

Type: number
Default: 3

Related

element-to-path Convert SVG element into path

path-that-svg Convert entire SVG with path

svg-path-tools Tools to manipulate SVG path (d)

svgson Transform SVG into Object

License

MIT © Lionel Tzatzkin

scale-that-svg's Issues

Can't get it to work (scale is not a function)

Your documentation is very sparse... so sparse, that I can't get the simplest example to work.
I successfully installed (via yarn) the package, but can't get it to run. I'm sure it's my mistake, but I don't know where to look.
Here's my sample code (test.js):

const fs = require('fs');
const scale = require('scale-that-svg');

fs.readFile('./test.svg', (err, input) => {
  scale(input, { scale: 0.5 }).then(scaled => {
    console.log({ scaled })
  })
})

Running node test.js results in

TypeError: scale is not a function
    at fs.readFile (/var/www/tmp/svgResize/test.js:5:3)
    at FSReqWrap.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:53:3)

I'm running node (v10.21.0) on Debian.

Does not scale width and height:

The svg width and height are not changed:

Example: (16x10) * 200

svgScale(
`<svg width="16" height="10" xmlns="http://www.w3.org/2000/svg">
<path d="M15.142.929L8.072 8 1 .929" stroke="black" stroke-width="2" fill="none"/>
</svg>`, 
  { scale: 200}
)
  .then((scaledFromString) => console.log({ scaledFromString }))

Result: (16x10)

<svg width="16" height="10" xmlns="http://www.w3.org/2000/svg"><path d="M3028.4 185.8L1614.4 1600 200 185.8" stroke="black" stroke-width="400" fill="none"/></svg>

Expected result: (3200x2000)

<svg width="3200" height="2000" xmlns="http://www.w3.org/2000/svg"><path d="M3028.4 185.8L1614.4 1600 200 185.8" stroke="black" stroke-width="400" fill="none"/></svg>

Problem with resizing some SVG files

Hi There,
I found an issue in SVG resizing.
The original SVG file is here
when I try to resize it with the package, something wrong happens. You can see the result here
I have this problem in only like 1% of SVG files. I hope we find a solution for it. :)

Best regards,
Ali