gpt4 book ai didi

javascript - xeponline.jqPlugin.js(或 css2pdf)SVG 引用另一个 SVG 不会在 PDF 中显示

转载 作者:太空宇宙 更新时间:2023-11-04 15:56:34 25 4
gpt4 key购买 nike

我正在尝试为我的 HTML 页面创建正确的 PDF。我已经设法将除 SVG 之外的所有内容都包含在 PDF 中。我尝试找出问题所在,所以尝试了这个并且效果很好:

<svg id="testSVG" width="100" height="100" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
<circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
Sorry, your browser does not support inline SVG.
</svg>

但是,如果我这样做:

<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
<use xlink:href="#testSVG" width="100" height="100"/>
</svg>

现在不再这样了。它确实显示在浏览器和 media="print" 上所以我怀疑这可能是语法。有谁知道 SVG <use>元素实际上由 xeponline.jqPlugin.js 支持(或css2pdf)?

最佳答案

Cloudformatter 插件正在抓取 DOM 并将其组装成结构化内容以发送到服务器。它执行一些操作,主要是为了确保内容的结构为 XML。

我想你是在问为什么在那个结构中,你有一个ID为#whatever的SVG,它没有在该结构中另一个“使用”名为#whatever的结构的SVG中使用。

答案是,它不会,因为它不应该。 SVG 的用途是在该 SVG 的多个位置重用该 SVG 内的内容。您正在尝试将 DOM 中的 SVG 重用到该 DOM 内 SVG 内的另一个位置。

如果这对浏览器有效,那对它们来说也很好。但这不是标准。标准中 SVG 的使用很明显,它是为了重用同一 SVG 中的内容。

就我个人而言,我不明白它为什么会起作用。就像同一页面上有五个动态图表一样,该代码在每个图表中创建#gradient1、#gradient2,它们都是不同的。我的图表应该使用哪个#gradient1?里面那个?还是另一张图表中的那个?还是第一个图表?

举一个简单的例子,我在同一页面上有 2 个图表。它们是从 Javascript 动态创建的,因此它们在内部执行的操作能够在其内部单独理解 SVG 本身的性质和结构。他们可以在内部创建一组在内部应用的 ID,但他们当然不知道页面上存在什么。

图表 1 包含以下内容:

<rect id=”rect1” x="0" y="0" width="720" height="400" strokewidth="0" fill="#FFFFFF" class=" highcharts-background"/>

图表 2 包含以下内容:

<rect id=”rect1” x="0" y="0" width="220" height="200" strokewidth="0" fill="#FFFFFF" class=" highcharts-background"/>

现在,在第一个 SVG 内部引用了 id“rect1”,并且它也在第二个 SVG 中被引用。但请注意,它们的尺寸不同。现在,这是可行的,因为它们是每个 SVG 的内部并且是不同的。问自己这个问题:

为什么绘制图表 1 时没有引用第二个图表?

为什么绘制图表 2 时没有引用第一个图表?

现在,正如您所做的那样,您创建了第三个 SVG 并在其中使用“rect1” - 它将使用哪个“rect1”?毕竟现在有两个了。

您当然可以尝试修改 Javascript 来尝试解决这样的使用问题,但由于上述原因,这将是一个完全一次性的解决方案。在第三个示例中 - 您不知道将哪一个复制到 SVG 中。

关于javascript - xeponline.jqPlugin.js(或 css2pdf)SVG <use> 引用另一个 SVG 不会在 PDF 中显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42645307/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com