CODEWITHSUNDEEP
javascriptsvgpng
Harikrishnan
Harikrishnan

Reputation: 3822

Generate a low resolution PNG from SVG using javascript

I wanted to convert an SVG file to PNG file. But the SVG view box is "0 0 8268 5827" so it will generate a huge file. I want to generate a small file from that SVG. Can anybody tell me how can I do that?

I used Canvg like 

var c = $('#export_canvas')[0];
canvg(canvas, data.svg, {renderCallback: function() {
        var datauri = data.quality ? c.toDataURL('image/' + "png", data.quality) : c.toDataURL('image/' + "png");
        window.open(datauri);
    }});

But it is generating big image.

Upvotes: 0

Views: 611

Answers (1)

Harikrishnan
Harikrishnan

Reputation: 3822

Finally I found the solution. There is a scale transformation available for SVG.

                var svgStr = $(data.svg);
                svgStr.removeAttr("height");
                svgStr.removeAttr("width");
                $(svgStr.find("g")[0]).attr("transform", "scale(0.09)");

where "g" is the top group tag.

Upvotes: 2

Related Questions