相关疑难解决方法(0)

在另一个中包含一个SVG

是否可以在没有光栅化效果的情况下将一个SVG包含在另一个SVG中?我试过这个

<svg version="1.2" width="600.0pt" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 <image height="655.813953488" width="600.0" x="0" xlink:href="A.svg" y="0"/>
 <image height="740.540540541" width="600.0" x="0" xlink:href="B.svg" y="655.813953488"/>
</svg>
Run Code Online (Sandbox Code Playgroud)

这使得的合成图像A.svgB.svg但他们失去了矢量图形属性,变成位图(在测试chrome, inkscape, inkvieweog).生成的svg将不会显示在Web浏览器中,因此外部JavaScript调用不是一个选项.如何在不复制粘贴和保留矢量化的情况下将一个svg"包含"在另一个svg中?

缩放铬合成图像的结果:

在此输入图像描述

(A.svg单独不存在效果)

编辑:这是我用来测试的确切图像:

A.svg

<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="129pt" height="141pt" viewBox="0 0 129 141" version="1.2">
  <defs>
    <g>
      <symbol overflow="visible" id="glyph0-0">
    <path style="stroke:none;" d="M 133.296875 0 L 133.296875 -5.1875 C 122.734375 -5.1875 119.15625 -5.1875 116.5625 -12.546875 L 72.328125 -137.6875 C 71.328125 -140.265625 …
Run Code Online (Sandbox Code Playgroud)

svg include

11
推荐指数
0
解决办法
6668
查看次数

Safari无法在嵌套的SVG中呈现图像

因此,鉴于此HTML,背景图像在Firefox,IE和Chrome中加载得很好.但在Safari中,它只是忽略它.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta http-equiv="Content-Style-Type" content="text/css">
  <title></title>
</head>
<body>
  <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 141.72999572753906 255.1199951171875">
    <image xlink:href="http://labels.labellogiclive.com/alfresco_10_p1_alf001_uk__v0.svg" preserveAspectRatio="none" x="0" y="0" width="141.73" height="255.12"></image>
  </svg>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

现在我认为它可能是一个服务器问题,没有给出正确的标题,但我已经检查过它看起来不错(image/svg+xml).所以我有点亏......有什么想法吗?

safari svg image

10
推荐指数
1
解决办法
573
查看次数

是否可以在 Inkscape svg 中包含指向 pdf 或 svg 文件的链接?

我正在使用 python 创建一堆我的数据图,然后 Inkscape 在主图的面板中布置单独​​的图和原理图。我还添加了一些额外的元素,例如面板名称和标题。

每次我修改 Python 代码中的某些内容时,我都必须手动将 svg/pdf 图粘贴到 Inkscape 中。我注意到,如果我将绘图创建为光栅图像而不是矢量,我可以在 Inkscape 文档中插入一个链接,并且每次我在 python 中重新生成绘图时都会更新图形面板,这是惊人的!

目前我正在使用这种具有高 DPI 的方法,但理想情况下,我想插入一个指向 svg/pdf 文件的链接,以便整个图形是一个矢量,而不是一个高 DPI、大尺寸的光栅。我已经看到可以在 Adob​​e Illustrator .ai 文件中以这种方式包含 pdf(不认为 svgs 工作),我想知道是否有任何方法可以在 Inkscape 中做到这一点?

当我插入图像链接时,Inkscape 在 svg 中创建一个类似于此的标签

<image
   sodipodi:absref="path/to/image.png"
   xlink:href="./image.png"
   y="14.014872"
   x="5.9285898"
   id="image12160"
   preserveAspectRatio="none"
   height="441.91879"
   width="466.55328" />
Run Code Online (Sandbox Code Playgroud)

我可以修改路径以指向 svg 文件,但 Inkscape 会自动将 svg 转换为低分辨率光栅。如果我将路径更改为 pdf,则会出现错误。有什么我可以在 svg 代码中修改的东西,以便能够链接 pdf/svg 文件并让它们在 Inkscape 中呈现为矢量文件?

pdf svg adobe-illustrator inkscape

6
推荐指数
0
解决办法
947
查看次数

渲染递归 SVG 文件

是否存在可以智能处理递归(即自引用)svg 文件的现有渲染器?

例如,这个问题的代码:

<svg width="100%" height="100%" viewBox="-100 -100 200 200" version="1.1"
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink">
  <circle cx="-50" cy="-50" r="30" style="fill:red" />
  <image x="10" y="20" width="80" height="80" xlink:href="recursion.svg" />
</svg>
Run Code Online (Sandbox Code Playgroud)

在 Firefox、Chrome 或 Inkscape 中无法正确渲染 - 但 制作一个渲染器来跟踪打开特定文件的次数,并在一定次数的迭代后停止似乎并不困难......

(如果不存在,如果我想自己编写一个代码,我可以去哪里寻找?)

recursion svg rendering

5
推荐指数
2
解决办法
2614
查看次数

Firefox不能正确渲染SVG,其他浏览器也是如此

我是SVG和D3的新手,在我实施的过程中学习.面对我目前正在处理的其中一个网站的问题.

要求:
我们想要创建一个自定义图形(类似于条形图),它具有一组代表我的数据点的条形图,并且某些图标根据条形图数据的类型嵌入到这些条形图中.该图表代表了一个人在整个职业生涯中取得的成就.在栏上悬停时,我们会显示一个自定义弹出窗口,其中包含该栏的简要说明(请参阅下面的示例).一些条形图有一个额外的箭头,表示条形图是否代表用户当前正在追求的体验.

到目前为止的进展:
您可以在TIMELINE部分看到我的个人资料.

那么,什么错了?
Chrome上的一切正常(如截图所示).所有其他浏览器在没有图标的情况下渲染图形 您可以在Chrome和Firefox上查看我的个人资料.

我复制了d3生成的SVG HTML代码并将其粘贴在jsfiddle中以在所有浏览器上测试它并发现所有浏览器都在渲染它:(忽略颜色,我没有应用CSS,但图标显示)http:/ /jsfiddle.net/EbpPG/1/

See JS fiddle link
Run Code Online (Sandbox Code Playgroud)

检查我的个人资料以查看图表.生成图形的逻辑可以在chart.js文件createTimelineChart()函数中找到.

有人可以看看它,让我知道我犯的是什么错误?

html javascript css svg d3.js

4
推荐指数
1
解决办法
1650
查看次数

SVG支持多少级别的递归?

我不能超过2级.(尝试过Iceweasel和Chromium.)

作为测试,我尝试了在此前面的回复中提供的代码的变体.这个包含3个单独的文件,其中a.svg包括b.svg,b.svg包括c.svg.(注意: 这不是一个循环.)

<!-- a.svg -->
<svg width="100%" height="100%" viewBox="-100 -100 200 200" version="1.1"
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink">
  <circle cx="-50" cy="-50" r="30" style="fill:#b58900" />
  <image x="10" y="20" width="80" height="80" xlink:href="b.svg" />
</svg>
Run Code Online (Sandbox Code Playgroud)
<!-- b.svg -->
<svg width="100%" height="100%" viewBox="-100 -100 200 200" version="1.1"
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink">
  <circle cx="-50" cy="-50" r="30" style="fill:#cb4b16" />
  <image x="10" y="20" width="80" height="80" xlink:href="c.svg" />
</svg>
Run Code Online (Sandbox Code Playgroud)
<!-- c.svg -->
<svg width="100%" height="100%" viewBox="-100 -100 200 200" version="1.1" …
Run Code Online (Sandbox Code Playgroud)

svg

4
推荐指数
1
解决办法
268
查看次数