目前没有在chrome中显示SVG符号

2018-06-20 06:00:07

我一直在使用SVG文件中的符号出现问题。它们目前不在浏览器中显示。

例如，我在inkscape中创建了这个基本的SVG文件来显示问题：

<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="100" width="100" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100" xmlns:dc="http://purl.org/dc/elements/1.1/">
 <defs>
  <symbol id="circle">
   <circle style="color-rendering:auto;color:#000000;isolation:auto;mix-blend-mode:normal;shape-rendering:auto;solid-color:#000000;image-rendering:auto" stroke-width="3.257" stroke="#008000" cy="1000.1" cx="34.598" r="12.879"/>
  </symbol>
 </defs>
 <g transform="translate(0 -952.36)">
  <use xlink:href="#circle"/>
 </g>
</svg>

它应该是这样的：

但由于某种原因，它不在铬中显示，有人知道为什么吗？

您最初的符号大部分都是在视图框之外绘制的 - 您的viewBox是100 x 100，但您的cy是100.1。这似乎完全禁用了绘图，因此当您使用翻译将它带回视图框时，没有任何内容。调整你的cy，让你在viewbox内绘画，并减少你的翻译来补偿。

链接地址: http://www.djcxy.com/p/56955.html

上一篇: SVG symbol currently not displaying in chrome

下一篇: Are there any ways to convert a SVG progressive draw to a video?