我有一组从Inkspace导出的SVG定义,并且任何自己完成此操作的人都会知道生成的定义通常包含更多准确性,实际上是合理的。例如,对于下面显示的32 x32图标定义,Inkspace每个像素生成6个(或更多!)小数精度。现在我知道这意味着它会扩展,但在我的情况下,我宁愿在我的应用程序中节省空间,这需要输入数百个这样的图标定义。
<svg width="32" height="32"><path d="M 14.576172 5.453125 L 13.78125 8.8222656 L 12.464844 9.3691406 L 9.5625 7.5898438 L 7.5898438 9.5351562 L 9.3691406 12.576172 L 8.8222656 13.78125 L 5.4785156 14.630859 L 5.4785156 17.369141 L 8.8496094 18.246094 L 9.3691406 19.507812 L 7.5625 22.464844 L 9.5351562 24.410156 L 12.548828 22.658203 L 13.808594 23.177734 L 14.603516 26.494141 L 17.396484 26.521484 L 18.191406 23.177734 L 19.505859 22.658203 L 22.410156 24.410156 L 24.355469 22.410156 L 22.658203 19.451172 L 23.150391 18.191406 L 26.492188 17.369141 L 26.492188 14.630859 L 23.123047 13.726562 L 22.630859 12.521484 L 24.410156 9.5351562 L 22.410156 7.5898438 L 19.451172 9.3417969 L 18.246094 8.8222656 L 17.396484 5.453125 L 14.576172 5.453125 z M 15.984375 12.082031 A 3.9078221 3.9078221 0 0 1 19.892578 15.988281 A 3.9078221 3.9078221 0 0 1 15.984375 19.896484 A 3.9078221 3.9078221 0 0 1 12.078125 15.988281 A 3.9078221 3.9078221 0 0 1 15.984375 12.082031 Z" fill="#f9f9f9" /></svg>
所以我的问题是我如何使用文本编辑器修改定义来说明2位小数。
我发现通过使用TextWrangler和以下grep搜索并替换字符串
(\.[0-9][0-9])([0-9][0-9][0-9][0-9][0-9][0-9])
\1
我可以搜索所有6位小数字符串并用2位小数替换它们。然后我可以更改搜索并替换为
(\.[0-9][0-9])([0-9][0-9][0-9][0-9][0-9])
\1
然后到
(\.[0-9][0-9])([0-9][0-9][0-9][0-9])
\1
最后到
(\.[0-9][0-9])([0-9][0-9][0-9])
\1
这可行。
然而,如果某人的脑像素比我略多(或很多),可以通过一次搜索和替换操作向我展示如何完成上述所有操作,我会非常高兴。
答案 0 :(得分:2)
要使用文本编辑器将定义修剪为x小数位,您只需使用Notepad ++的正则表达式搜索模式:
(\d+\.\d{x})\d*
放入查找内容(将x替换为您想要的位数)\1
放入替换为结果使用您的示例:
之前:
之后:
您可以下载最新版本的Notepad ++ here。
答案 1 :(得分:2)
我非常乐于帮助优化用矢量编辑器绘制的svg文件 由 Peter Collingridge 制作的实用程序 - SVG Editor
界面直观,几乎可以立即开始工作。
结果很好:
答案 2 :(得分:2)
使用将所有数字减少到两位小数的RegEx方法非常天真。并非所有小数都相同。例如,考虑以下矩阵变换:
transform="matrix(0.999848,0.017452,-0.034905,0.999543,-4.0838,-3.8401)"
将这些数字减少到两位小数会将第二个数字改为41%。这有意义吗?是的,事实上你可以用它来获得漂亮的压花效果:
<svg viewBox="0 0 20 20" width="100" height="100">
<text x="7" y="22" style="font-size:20;fill:#000000"
transform="matrix(0.999848,0.017452,-0.034905,0.999543,-4.0838,-3.8401)">A</text>
<text x="7" y="22" style="font-size:20;fill:#ffffff;opacity:0.8"
transform="matrix(0.99,0.01,-0.03,0.99,-4.08,-3.84)">A</text>
</svg>
这就是为什么Inkscape在其设置中使用术语“精度”并将其舍入为固定数量的重要数字(123.4,0.01234,...)
第二个问题是您可能在SVG中的某处进行了缩放转换。您是否在上面的代码段中看到矩形的给定大小是用因子5缩放的?它隐含在viewBox
,ẁidth
和height
属性中。如果缩放不是5,而是1000,该怎么办?是的,我在野外看到过这种关系。 特别是如果使用Inkscape生成grafic。
所以:小心处理。
答案 3 :(得分:1)
要从(bash或shell)命令行中删除不需要的精度,请尝试:
sed -E 's/([[:digit:]]\.[[:digit:]]{2})[[:digit:]]+/\1/g' file.svg
要更改文件(Linux),
sed -i.bak -E 's/([[:digit:]]\.[[:digit:]]{2})[[:digit:]]+/\1/g' file.svg
或OSX:
sed -i .bak -E 's/([[:digit:]]\.[[:digit:]]{2})[[:digit:]]+/\1/g' file.svg
这会查找有数字的任何地方,后跟一个句点,后跟两位数字,后跟一些数字:
([[:digit:]]\.[[:digit:]]{2})[[:digit:]]+
第一个数字,句点和后面的两个数字位于parens中。这将它们保存到我们用作替换文本的组1。
您的输入文件:
$ cat >file.svg
<svg width="32" height="32"><path d="M 14.576172 5.453125 L 13.78125 8.8222656 L 12.464844 9.3691406 L 9.5625 7.5898438 L 7.5898438 9.5351562 L 9.3691406 12.576172 L 8.8222656 13.78125 L 5.4785156 14.630859 L 5.4785156 17.369141 L 8.8496094 18.246094 L 9.3691406 19.507812 L 7.5625 22.464844 L 9.5351562 24.410156 L 12.548828 22.658203 L 13.808594 23.177734 L 14.603516 26.494141 L 17.396484 26.521484 L 18.191406 23.177734 L 19.505859 22.658203 L 22.410156 24.410156 L 24.355469 22.410156 L 22.658203 19.451172 L 23.150391 18.191406 L 26.492188 17.369141 L 26.492188 14.630859 L 23.123047 13.726562 L 22.630859 12.521484 L 24.410156 9.5351562 L 22.410156 7.5898438 L 19.451172 9.3417969 L 18.246094 8.8222656 L 17.396484 5.453125 L 14.576172 5.453125 z M 15.984375 12.082031 A 3.9078221 3.9078221 0 0 1 19.892578 15.988281 A 3.9078221 3.9078221 0 0 1 15.984375 19.896484 A 3.9078221 3.9078221 0 0 1 12.078125 15.988281 A 3.9078221 3.9078221 0 0 1 15.984375 12.082031 Z" fill="#f9f9f9" /></svg>
我们的命令:
$ sed -E 's/([[:digit:]]\.[[:digit:]]{2})[[:digit:]]+/\1/g' file.svg
<svg width="32" height="32"><path d="M 14.57 5.45 L 13.78 8.82 L 12.46 9.36 L 9.56 7.58 L 7.58 9.53 L 9.36 12.57 L 8.82 13.78 L 5.47 14.63 L 5.47 17.36 L 8.84 18.24 L 9.36 19.50 L 7.56 22.46 L 9.53 24.41 L 12.54 22.65 L 13.80 23.17 L 14.60 26.49 L 17.39 26.52 L 18.19 23.17 L 19.50 22.65 L 22.41 24.41 L 24.35 22.41 L 22.65 19.45 L 23.15 18.19 L 26.49 17.36 L 26.49 14.63 L 23.12 13.72 L 22.63 12.52 L 24.41 9.53 L 22.41 7.58 L 19.45 9.34 L 18.24 8.82 L 17.39 5.45 L 14.57 5.45 z M 15.98 12.08 A 3.90 3.90 0 0 1 19.89 15.98 A 3.90 3.90 0 0 1 15.98 19.89 A 3.90 3.90 0 0 1 12.07 15.98 A 3.90 3.90 0 0 1 15.98 12.08 Z" fill="#f9f9f9" /></svg>
答案 4 :(得分:1)
在Inkscape中设置精度:
较新版本:Menubar | Edit | Preferences | Input/Output | SVG Output | Numbers
旧版本:Menubar | Edit | Inkscape Preferences | SVG Output | Numbers
答案 5 :(得分:0)
答案取决于您将内容插入文件的方式。
如果您手动复制.svg
文件的内容,并且必须手动使用上述步骤来缩小HTML,那么肯定有更好的方法:存储您的主文件{ {1}}在一个名为.svgs
的文件夹中,调用脚本将这些。svgs
缩小到另一个名为svgs
的文件夹中。这样,每次手动复制标记时,都会使用svgsminified
文件夹中的缩小版本。
如果您的IDE为您添加了svgsminified
文件的标记,那么希望IDE中有一个脚本功能,允许您调用外部脚本来预先缩小传入的{{1} 1}}标记。
如果您正在使用Powershell(适用于* nix和Windows),则缩小文件夹中所有.svgs的缩小脚本将类似于:
.svg
答案 6 :(得分:0)
通过给出svg:
<path id="hair" d="m208 14.2c-61.3 0-111 49.7-111 111 0 61.3 49.7 111 111 111 61.3 0 111-49.7 111-111-0.1-61.2-49.7-111-111-111z"/>
要舍入到最接近的整数,请使用:
perl -i -pe 's/(\d*\.\d*)/int($1+0.5)/ge' file
结果:
<path id="hair" d="m208 14c-61 0-111 50-111 111 0 61 50 111 111 111 61 0 111-50 111-111-0-61-50-111-111-111z"/>