SVG格式图片的放大

SVG是一种矢量格式图片，即可以无损放缩，其存储的是图像中每个元素的定义，如方块、椭圆等。越来越多的网站采用SVG格式来表达图表。但是SVG格式并不能像png、jpj那样直接拖拽防缩，但只要稍微修改源代码即可。
以笔者关注的叙利亚战争形势图为例（额。。竟然不支持svg格式的显示）。虽然是无损存储但拖拽窗口没法放大，细节根本看不清。
https://en.wikipedia.org/wiki/Syrian_Civil_War#/media/File:Syrian_Civil_War_map.svg

用vscode打开图片来看看源码。vscode是微软出的傻瓜式编辑器，可视化的安装各种插件，虽然可能还没有sublime或notepad++方便，但非常容易上手。

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->

<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:xlink="http://www.w3.org/1999/xlink"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   version="1.1"
   width="983.28534"
   height="812.71039"
   viewBox="0 0 921.83003 761.916"
   id="Syria_1_"
   xml:space="preserve"
   inkscape:version="0.91 r13725"
   sodipodi:docname="wewbadmnap3.svg"
   inkscape:export-filename="C:\Users\Christine\Downloads\Rumala.png"
   inkscape:export-xdpi="350"
   inkscape:export-ydpi="350"><sodipodi:namedview

这里只截取了代码的头部，当然我们所关注的也就是头部。svg段是主要的显示参数定义
width,height控制显示在屏幕的面积，改变会防缩图像、viewBox表示显示矢量相对坐标被显示在屏幕的范围
如果原图是长a，宽b的，则截取其中viewBox的部分，拉伸放在width,height所定义的屏幕区域中
一般来说只用修改width和height。只要简单粗暴的在width = “983.28534”
 height = “812.71039”
 的数值上前面加个1，变成width=”1983.28534”
 height=”1812.71039”
就足够了，再用浏览器打开就可以看细节了，如果不够清晰还可以继续调数值。这里不用担心会变形，如果放大后和边框不匹配会自动留白的。