☰

为什么有些查看器/编辑器无法正确打开此 SVG 文件？

tag-icon • tag-icon inkscape svg transparency libreoffice-draw image-formats
为什么有些查看器/编辑器无法正确打开此 SVG 文件？

考虑这个 SVG 文件（box.com 链接；我无法在这里上传。）

它有一个“选中”或“标记为 v”的符号，透明的黑色。奇怪的是，一些查看器可以正确显示它，而其他查看器则将其显示为完全空白，即全透明。就编辑器而言，LibreOffice Draw 和 Inkscape 在加载时都会显示一个空白画布，而 gimp 会显示实际的选中标记（当然，它会将其栅格化）。

SVG 真的有问题吗？还是应用程序出了问题？无论如何，我是否可以修改 SVG，以便更可能正确读取它？

答案1

理解 SVG 文件的一个关键是要意识到它们与其他常见的图像文件格式不同。它们是一种更类似于 HTML 和 XML 的标记语言。这是您的 SVG 文件的源代码：

<!-- This Source Code Form is subject to the terms of the Mozilla Public
   - License, v. 2.0. If a copy of the MPL was not distributed with this
   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
    <path fill="context-fill" fill-opacity="context-fill-opacity" d="M6 14a1 1 0 0 1-.707-.293l-3-3a1 1 0 0 1 1.414-1.414l2.157 2.157 6.316-9.023a1 1 0 0 1 1.639 1.146l-7 10a1 1 0 0 1-.732.427A.863.863 0 0 1 6 14z"/>
</svg>

该path语句就是您的复选标记。d=属性是定义复选标记形状的说明。将其想象成一块完全透明（不可见）的玻璃。玻璃存在……但您看不到它。您可以感觉到它和它的形状……但您必须对它做更多的事情才能看到那个形状。

这里没有的是描边属性。描边将定义形状外边缘周围的线条。我们可以定义描边的宽度（线条的粗细）、颜色和其他属性。但是，如果不这样做……我们的不可见玻璃形状周围没有线条……因此它仍然是不可见的。

我们确实有填充属性（fill=和fill-opacity=）。填充定义形状表面的颜色和内容。但是，填充属性设置为context-fill和context-fill-opacity。上下文填充是非标准功能。它很可能会被主流浏览器的新版本所支持（我亲自用最新的 Edge、Firefox 和 Chrome 测试过它）……但是，不能保证它会被更接近标准的图像查看器和编辑器所支持。任何不支持此功能的应用程序都可能会完全忽略它。

这就是你的问题。你没有描边……而且，在不支持上下文填充的应用中，你没有填充。这让你留下了看不见的玻璃碎片。它就在那里……你只是看不到它。

答案2

当我将文件加载到 Inkscape 中时，它显示为空，但 Control-A 选择了“全部”。使用 Inkscape 的描边和填充功能，我将填充留空，并添加了描边颜色。

复选标记

顶部图像的笔触宽度为 0.265 毫米，而底部图像的笔触宽度则小得多。

相关内容