时间戳

首页 > 解决方案 > Firefox 不显示 use 元素 + xlink:href 属性引用的路径

firefox - Firefox 不显示 use 元素 + xlink:href 属性引用的路径

问题描述

我path在 paths.svg 文件中定义了一些元素（https://gist.github.com/amirteymuri/42a64256c27824816f4f4c3b670bcb3d，请以原始文本打开）。当我用inkscape打开file.svg（如下面的代码所示）但不是用firefox打开file.svg（在Mirage中也没有显示引用的路径）时，这工作正常：

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" height="100" width="100">
  <use xlink:href="./glyph-paths.svg#117"
       transform="scale(0.01, 0.01) translate(200, 500)"/>
</svg>

我知道它xlink:href已被弃用，href应该使用新版本，但是将 file.svg 中的更改为xlink:href导致href所有内容都消失，因此即使在 inkscape 中我也没有任何引用的路径了。有人可以给我更多信息吗？

编辑@罗伯特朗森

这是一个名为 haydn.svg 的文件，我在其中导入了一些字形作为路径（为了简单起见，我在这里只包含了我将要使用的路径之一）：

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
 <path transform="translate(0 0) scale(1 -1)" id="rests.2" d="M80 398c50 -68 90 -118 143 -184c6.22621 -7.92426 9.24864 -16.1689 9.24864 -24.7339c0 -6.56702 -1.77679 -13.3224 -5.24864 -20.2661c-19 -36 -40 -50 -69 -79c-10.4374 -10.8389 -14.9122 -26.0289 -14.9122 -42.9176 c0 -25.1817 9.94817 -54.1399 24.9122 -78.0824c40 -63 65 -107 104 -160c2.19052 -2.98708 3.11205 -6.05347 3.11205 -8.94647c0 -8.00267 -7.0515 -14.6785 -13.7996 -14.6785c-3.0625 0 -6.0625 1.375 -8.3125 4.625 c-18.7932 27.2501 -46.4159 62.4468 -87.0167 62.4468c-2.60722 0 -5.26795 -0.14514 -7.9833 -0.446846c-37.3002 -3.82566 -78.2594 -24.1165 -78.2594 -59.1228c0 -34.3572 13.2203 -53.8112 29.2594 -80.8772c1.90983 -3.24671 2.72542 -6.16515 2.72542 -8.67173 c0 -6.11404 -4.85254 -9.77763 -10.5138 -9.77763c-4.17048 0 -8.77986 1.98813 -12.2116 6.44936c-49 63 -97 106 -104 176c-0.304 2.7968 -0.452741 5.54555 -0.452741 8.24286c0 41.6664 35.4927 71.0611 82.4527 75.7571 c3.25176 0.309691 6.33568 0.451543 9.24434 0.451543c15.8756 0 26.5299 -4.22577 30.7557 -8.45154c6.0717 -5.31274 12.2874 -7.31334 17.2809 -7.31334c6.07303 0 10.3383 2.95907 10.3383 6.51795c0 1.22609 -0.506256 2.52338 -1.61926 3.79539 c-40 43 -69 91 -113 127c-9.72408 8.00806 -15.5219 22.5599 -15.5219 37.1052c0 10.8833 3.24596 21.7629 10.5219 29.8948c22 24 57 47 79 66c16.7435 14.9495 23.8322 33.1173 23.8322 52.5788c0 13.0839 -3.20398 26.7525 -8.83224 40.4212c-12 30 -23 48 -41 80 c-8 14 5 20 12 10z"/>

"rests.2"然后我通过使用元素从同一目录中的另一个文件调用use（所以没有服务器等，但我想知道，因为不仅路径没有显示在 FireFox 中，而且我在 GIMP 和Geeqie. 实际上只有 Inkscape 显示使用的路径，by xlink:href)：

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="210.00000mm" height="297.00000mm">

  <use xlink:href="haydn.svg#rests.2"
       transform="translate(200 200)
          scale(0.1)"/>
</svg>

标签： firefoxsvghrefxlink

解决方案

Inkscape 不支持 href 属性，仅支持（已弃用）xlink:href。所以不是你，它只是 Inkscape。

当我在 Inkscape 中创建元素时，我手动创建了一个 href 属性来匹配 xlink:href，因为使用 JavaScript 操作 href 比 xl;ink:href 更容易。

是否将 xlink:href 保留在最终文件中取决于您，以及是否需要再次将文件放回 Inkscape。

推荐阅读