Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how do i increase the size of this SVG?

Tags:

html

xml

svg

http://upload.wikimedia.org/wikipedia/commons/a/a5/Map_of_USA_with_state_names.svg

is it possible to increase the size of this map?

like image 572
Alex Gordon Avatar asked Aug 17 '10 16:08

Alex Gordon


People also ask

Does SVG image have size?

The thing is: SVG images don't have a "size" in the sense you are probably thinking of. On the other hand, they DO have a height-to-width ratio. This ratio can usually be found in the viewBox attribute.

How do I change SVG text size?

You can not change the font size or font width because SVG is not a font. It is Scalable Vector Graphics. If you would have some text in your SVG then you could do something with the font from the text element.


1 Answers

Yes. As you know, SVG files are vector images, so you can simply zoom in when you view it.

But if you want to change the default size, then you can replace

<svg 
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   version="1.0"

   width="958.69"
   height="592.78998"

   id="svg2275"
   sodipodi:version="0.32"
   inkscape:version="0.46"
   sodipodi:docname="Map of USA with state names.svg"
   sodipodi:docbase="C:\temp\webdesign"
   inkscape:output_extension="org.inkscape.output.svg.inkscape"> 

with

<svg 
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   version="1.0"

   width="1917.38"
   height="1185.57996"
   viewBox="0 0 958.69 592.78998"

   id="svg2275"
   sodipodi:version="0.32"
   inkscape:version="0.46"
   sodipodi:docname="Map of USA with state names.svg"
   sodipodi:docbase="C:\temp\webdesign"
   inkscape:output_extension="org.inkscape.output.svg.inkscape"> 

That is, you define the viewBox (to 0, 0, <oldWidth>, <oldHeight>), and then you can set the width and height as you wish. The above example thus doubles the width and height.

like image 154
Andreas Rejbrand Avatar answered Oct 26 '22 03:10

Andreas Rejbrand