svgexport is a Node.js module and command-line tool for exporting SVG files to PNG and JPEG, it uses Puppeteer for rendering SVG files.
npm i -g svgexport
Scale 1.5x proportionally:
svgexport input.svg output.png 1.5x
Scale proportionally to set output width to 32px:
svgexport input.svg output.png 32:
Scale proportionally and pad output to set output width:height to 32px:54px:
svgexport input.svg output.png pad 32:54
Export -1:-1:24:24
(left:top:width:height
) of input.svg to output.png:
svgexport input.svg output.png -1:-1:24:24 1x
Set output JPEG quality:
svgexport input.svg output.jpg 80%
Use a CSS to style input SVG:
svgexport input.svg output.jpg "svg{background:silver;}"
By default, Puppeteer has a page load timeout of 30 seconds. This might not be enough for large SVG files. If you want to change the page timeout, set the SVGEXPORT_TIMEOUT
environment variable to the desired number of seconds.
// One minute timeout SVGEXPORT_TIMEOUT=60 svgexport input.svg output.png
npm install svgexport --save
<span class="pl-k">var</span> <span class="pl-s1">svgexport</span> <span class="pl-c1">=</span> <span class="pl-en">require</span><span class="pl-kos">(</span><span class="pl-s">'svgexport'</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-s1">svgexport</span><span class="pl-kos">.</span><span class="pl-en">render</span><span class="pl-kos">(</span><span class="pl-s1">datafile</span><span class="pl-kos">,</span> <span class="pl-s1">callback</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
datafile
can be an object, an array of objects or a JSON file path, see command line usage for its format
npm init -y
npm i express
npm i multer
Make a uploads
directory inside the root project
const express = require('express') const multer = require('multer') const {exec} = require("child_process") const bodyparser = require('body-parser') const path = require('path') var storage = multer.diskStorage({ destination: function (req, file, cb) { cb(null, 'uploads') }, filename: function (req, file, cb) { cb(null, Date.now() + path.extname(file.originalname)) //Appending extension } }) var upload = multer({ storage: storage }).single('file') const app = express() app.use(bodyparser.urlencoded({extended:false})) app.use(bodyparser.json()) app.get('/', (req, res) => { res.sendFile(__dirname + "/index.html") }) app.post('/svgtoimage', (req, res) => { const format = req.body.format console.log(format) const outputfile = Date.now() + `output.jpg` upload(req,res,(err) => { if(err){ console.log("Error in Uploading file") } else{ console.log(req.file.path) exec(`svgexport ${req.file.path} ${outputfile}`,(err,stderr,stdout) => { if(err){ console.log("error in conversion of svg") } else{ res.download(outputfile,(err) => { }) } }) } }) }) app.listen(5000, () => { console.log("App is listening on port 5000 ") })
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>SVG to PNG/JPEG</title> </head> <body> <form action="/svgtoimage" method="post" enctype="multipart/form-data"> <input type="file" accept=".svg" name="file" required id=""> <select name="format" id=""> <option value="png" selected>PNG</option> <option value="jpg">JPG</option> </select> <button>Export to Image</button> </form> </body> </html>
MiniMax-M1 is a new open-weight large language model (456 B parameters, ~46 B active) built with hybrid…
Managing Git hooks manually can quickly become tedious and error-prone—especially in fast-moving JavaScript or Node.js…
Git hooks help teams enforce code quality by automating checks at key stages like commits…
Choosing the right Git hooks manager directly impacts code quality, developer experience, and CI/CD performance.…
We evaluated the performance of Llama 3.1 vs GPT-4 models on over 150 benchmark datasets…
The manufacturing industry is undergoing a significant transformation with the advent of Industrial IoT Solutions.…