Php 将div内容导出到图像

目前我正在做一个项目，在这个项目中，网站的用户可以通过拖放礼物来设计一个礼物球。拖放和排序工作非常完美，我能够将生成的礼品球存储到数据库中。在收件人端，系统会按发件人发送的相同顺序列出所有礼物图像，使其看起来像一个礼品袋。我想允许用户将此礼品球存储到单个图像中，这样他们就可以将礼品球存储到图像相册中。在当前的系统中，它将所有单独的礼物列在主包装div中的一个单独div中。如何将这个包装div导出到图像中，使其看起来与HTML相同。任何帮助都将不胜感激。等待答复

---

谢谢

我不知道是否有办法使用纯javascript，但您可以在服务器上生成图像并将其发送回。

我不知道是否有办法使用纯javascript，但您可以在服务器上生成图像并将其发送回。

我从未听说过通过JS将浏览器的视口保存到图像文件中。我认为只有创建SVG或使用HTML5画布才有可能实现vie。

我从未听说过通过JS将浏览器的视口保存到图像文件中。我认为只有创建SVG或使用HTML5画布才有可能实现vie。

不久前我问过同样的问题。

结论是。。。使用JS是不可能的。毫无疑问，从PHP也有可能。
Use可以使用在线服务进行屏幕捕获，比如browsershots，但它不是实时的，也不能很好地呈现所有内容

我为自己的处境采取了变通办法。 重新创建创建图像的所有DOM/HTML元素（从数据库加载参数并生成DOM）。将所有内容包装在一个容器div中，并将其缩小到所需的大小

---

我知道，这不是最漂亮的解决方案，但却是我能找到工作的唯一解决方案。

不久前我问了同样的问题。

结论是。。。使用JS是不可能的。毫无疑问，从PHP也有可能。
Use可以使用在线服务进行屏幕捕获，比如browsershots，但它不是实时的，也不能很好地呈现所有内容

我为自己的处境采取了变通办法。 重新创建创建图像的所有DOM/HTML元素（从数据库加载参数并生成DOM）。将所有内容包装在一个容器div中，并将其缩小到所需的大小

我知道，这不是最漂亮的解决方案，但却是我能找到的唯一解决方案。

使用

可以创建与页面外观相似的图像。试着这样做： 获取包装器的大小

，并创建相同的画布元素。然后获取每个图像在div包装器中的位置，并在画布上以相同的大小在相同的位置绘制该图像。 如果您需要绘制额外的控件，比如按钮或文本框，事情可能会更困难

现在，所有的现代桌面浏览器都支持

。

使用

可以创建与页面外观相似的图像。试着这样做： 获取包装器的大小

，并创建相同的画布元素。然后获取每个图像在div包装器中的位置，并在画布上以相同的大小在相同的位置绘制该图像。 如果您需要绘制额外的控件，比如按钮或文本框，事情可能会更困难

---

现在，所有的现代的桌面浏览器都支持

。

您可以使用任何一种浏览器，但这还不完美。或者将元素的浏览器偏移量存储在div中，然后使用GD或ImageMagick将它们组合成一幅图像

，您可以任意使用，但这还不够完美。或者将元素的浏览器偏移量存储在div中，然后使用GD或ImageMagick将它们组合成一幅图像

可能有用：

可能有用：

您好，谢谢您的回复。你能解释一下你的解决方案吗？你有适合你的代码吗？是的，但是你可能用不到。这基本上是黑客行为，因此非常依赖于实现。将可拖动元素的相对位置保存在db中（x、y、z、image_file_href、angle（如果需要））以及希望“image”出现的页面上，从db中获取数据，并创建新的div，这些div位于正确的位置（根据您在db中的位置）。如果大小需要与原始大小不同，只需将所有内容放在另一个div中，并对其应用缩放属性。您好，谢谢您的回复。你能解释一下你的解决方案吗？你有适合你的代码吗？是的，但是你可能用不到。这基本上是黑客行为，因此非常依赖于实现。将可拖动元素的相对位置保存在db中（x、y、z、image_file_href、angle（如果需要））以及希望“image”出现的页面上，从db中获取数据，并创建新的div，这些div位于正确的位置（根据您在db中的位置）。如果大小需要与原始大小不同，只需将所有内容放在另一个div中，并对其应用缩放属性。非常感谢您的回复。是否可以使用ImageMagick中的所有图像生成单个图像？也许ImageMagick是完美的解决方案，但我不确定。再次感谢。非常感谢您的回复。是否可以使用ImageMagick中的所有图像生成单个图像？也许ImageMagick是完美的解决方案，但我不确定。再次感谢。