在JavaScript（GIF / PNG）中創建DIV的圖像

Question

我想知道是否有可用的JavaScript庫，該庫可讓我從DIV的內容生成圖像。

基本上，這是某些服務器端打印代碼所必需的，這些代碼需要從瀏覽器中打印背景。

我最終想要做的是將DIV內容編碼為PNG格式，並通過打印操作發布編碼后的數據。

有什么想法可能嗎？

[編輯]我所擁有的是一個映射應用程序，其中背景數據從圖像服務器直接進入瀏覽器DIV（例如Google Maps）。 該div是我主要數據的背景。 按下“打印”后，服務器將從其知道的數據生成PDF，但對瀏覽器的背景數據一無所知。 我真正想要的是能夠以某種方式為服務器提供瀏覽器的背景圖片！

歡呼聲，Ro

Answer 1

也許通過Canvas可能：

MDN-使用畫布繪制圖形

Answer 2

您可以從JavaScript創建圖像標簽，但不能從其中的實際圖像創建圖像：JS沒有用於為位圖分配內存的命令，也沒有用於在其上呈現任何內容的命令。

通常的解決方案是在服務器上有一個報告生成器，該報告生成器可根據要求創建圖像。 看一下BIRT或JasperReports 。

[編輯]根據您的評論，解決方案很簡單：檢查DIV，找到背景圖像的URL，然后用IMG元素替換DIV。 將URL放入SRC屬性中，然后打印。

Answer 3

非常有趣的問題。

實際上，我使用ajax解決了這個問題（將圖像的位置傳輸到服務器，服務器從多個片段創建一個圖像，保存並將其發送到客戶端）。 我不太喜歡這種解決方案，但我還不了解。

Answer 4

我真的不認為這在瀏覽器上是不可能的，當然，如果沒有某種插件的話，這是不可能的。

您能否將一些坐標信息或其他內容發送到Web服務器，然后讓Web服務器從圖像服務器請求相同的地圖圖像？

Answer 5

只能在IE5中生成圖像:(然后由於安全原因，它被刪除了。我仍然不見了。

Answer 6

我想我已經找到了一種方法。

1）當用戶按下打印時，詢問DIV
2）OpenLayers API正在生成該DIV上的圖像
3）抓取每個圖片的網址
4）抓住每個圖像在屏幕上的位置
5）將屏幕位置轉換為真實位置（我有此API）
6）作為打印的一部分，發送所有圖像URL及其真實范圍
7）允許服務器重新請求圖像並將其繪制到適當的位置。

Answer 7

是否必須在瀏覽器端完成？ 我已經看到您可以在哪里進行服務器端調用，並且服務器響應上的MIME類型是圖像類型。 我認為我想的示例是針對db中b64編碼的jpeg的，但是過程應該是相同的。 響應將是您DIV中當前存在的數據。 對不起，如果我離基地遠一點。