问题标签 [dom-to-image]

我正在编写一个函数来使用dom-to-image将我的dom（带有id内容的div）渲染为png图像并在渲染后上传到我的服务器，因此引入了一个异步函数以等待完成图像处理，但在引入之后，它的在不同的浏览器中呈现异常。 我的渲染图像代码：

驱动代码：

在将函数 savetoserver 更改为 async 之前，它正在处理正确的图像，但在添加 async 关键字后，它在不同浏览器中的行为异常。

预期输出：

Mozilla Firefox 中的输出：

在 Chrome 中输出：

这里使用单独的 div 来显示所有内容，例如：

所以我想使用一个名为的 javascript 节点模块，"dom-to-image"因为我想在用户单击按钮后将 Div 作为图像下载。"dom-to-image"我使用 NPM安装了这个包"npm install --save dom-to-image"，我看到它在package.json文件的依赖项下，也在package-lock.json.

我像这样在我的组件中导入了包：import dom-to-image from "dom-to-image". 它工作正常，它做了它应该做的事情。但是当我打开分支git来做其他事情并回到这个分支时，我在终端中收到一条消息，说我需要再次安装这个包。我团队中的其他人也是如此。我们也非常不一致地得到这个问题，所以在我们得到这个问题之前必须经过一段时间。这是因为我导入的模块与其他模块不同吗？因为通常，我在导入某些东西时使用大括号。

我试过安装，@types/dom-to-image但这没有用。我检查了是否我gitignore的设置为 UTF-8 并且是。我使用了 html2canvas （我也导入了没有花括号的替代方法），但问题仍然存在。我正在尝试下载一个 div，其中包含一个 vis-network 画布，画布上有一个Textarea。

我正在使用 dom-to-image 库将 HTML 表转换为 SVG 图像，并稍后使用 MPDF 库在 pdf 文件中显示该图像。

HTML 此表是一个示例

Javascript 这里我使用 dom-to-image 库的 toSvg 函数将 dom 转换为 SVG 格式的图像，使用 ajax 将数据 URL 发送到服务器端：

PHP 我从全局变量中获取数据 URL( $data) 和 imageName( )，删除标记之前的所有内容并删除我一开始遇到问题的字符串，将内容放入 SVG 文件：$imageName$_POST<svg>%0A

该文件正在下载，并且 SVG 文件在 Opera、Firefox、Microsoft Edge 中显示没有任何问题，但是当将此 SVG 文件添加到 pdf 或任何其他矢量图形编辑器（如 Inkscape）时，SVG 图像无法正常工作。

问题： 可以在不使用任何库的情况下完成吗？如果有一个以正确方式执行此操作的库，我们可以让 SVG 也可以在 pdf 文件中工作吗？

当我尝试运行它时，我正在使用 Quasar 框架（Vuejs）中的 dom-to-image npm 包实现屏幕截图功能，它在附加图像中抛出异常。下面是我的代码。

//这个被调用由下面调用 const domtoimage = require('dom-to-image')

假设我有一个像卡片一样的 vue 组件，如下面的链接和下图所示

https://vuetifyjs.com/en/components/cards/#v-card-actions

我将如何实现用户可以单击按钮或下载带有此卡图片的 .png 文件的功能？

我目前的实现是使用“dom-to-image-more”库https://github.com/tsayen/dom-to-image

但是使用这个库，我在文件下载方面遇到了一些问题，如下图所示

我的单选按钮在我的 PNG 下载中变成了文本。

我目前的实现就像

有人可以帮我修复我当前的实现吗，也许我只能将屏幕的一部分下载为 PNG 文件，如果使用“dom-to-image-more”库可以的话？我还有一个我不想在下载过程中弹出的菜单。所以如果我能下载 90% 我想下载的内容，那就太好了

如果我不能使用这个库，那么我愿意接受任何其他建议！非常感谢你的帮助 ：）

我正在使用 jsPdf 下载包含已打开窗口中某个部分的屏幕截图的 pdf。对于全屏模式，它工作正常。该项目可以通过手机访问，并且视图会改变，所以我想在全屏模式下捕获屏幕。

可能吗 ？

当前功能：

我正在使用 jsPdf 下载包含已打开窗口中某个部分的屏幕截图的 pdf。对于全屏模式，它工作正常。该项目可以通过手机访问，并且视图会改变，所以我想在全屏模式下捕获屏幕。

可能吗 ？

当前功能：

我正在使用domtoimage尝试将我的 html div 转换为<svg>. domtoimage 中的函数返回字符串：
data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="288" height="1920"> .......... </svg>

我可以将此字符串设置为src的<img>，但我正在使用的其他插件（jsPDF）不能使用它，它需要<svg>.

我想我可以去掉开头部分，只将svg标签添加到文档中，但这会导致一个非常奇怪的 svg，到处都是“%0A”，我无法从字符串中删除它。

我正在开发一个使用DOM 到图像库和FileSaver.JS来保存图像的 meme 编辑器 Web 应用程序。

使用 PC 屏幕保存图像有些好，但使用手机屏幕保存时，显示的图像是像素化图像。

这是div我需要保存的：

另外，这是我保存图像的函数的代码：

此外，这是我的部分 meme 的 CSS 代码：

可能是什么问题？为什么会这样？如何解决？

有人能帮我吗 ？

我将使用 dom-to-image 库，但我不能为 div 类或 div id 编写过滤器。我试图谷歌，但我没有学到更多关于过滤的东西。这是我的代码。：