Search code examples
jqueryjquery-pluginssvgjquery-svg

How to Resize SVG to different sizes

I am using Jquery SVG plugin in my project. I want to resize my svg to different sizes I have written following code to load svg in smaller size

 $('#svgbasics').svg({
            loadURL: 'lion.svg', // External document to load 
            onLoad: null, // Callback once loaded 
            settings: {width: '100px'}, // Additional settings for SVG element 
            initPath: ''
        })

but it always open image in 100% size, Anyone please help me how can i show SVG in different sizes

Solution

  • after searching for days i find out following things

    if you want to resize your svg then we have to resize viewbox of svg, setting width will only resize outer display area

    we can resize svg by simply displaying it in image tag and resize it according to requirement i.e.

    <img width="200px" src="lion.svg"></img>

    i found answer in following post

    How do I scale a stubborn SVG embedded with the <object> tag?