HTML2Canvas空白圖像在iPad和筆記本電腦上

這裏非常低質量的圖像是我的代碼：HTML2Canvas空白圖像在iPad和筆記本電腦上

html2canvas($("#divImage"), { 
     onrendered: function(canvas) { 
      console.log ("w: " + canvas.width + "h: " + canvas.height); 
      window.open(canvas.toDataURL()); 
     } 
});

該代碼使用一臺筆記本電腦（Chrome或Safari）給了我一個非常低的分辨率的圖像，並給了我一個空白圖像在iPad上。控制檯中返回的高度和寬度爲400x400px，這是頁面上顯示的大小。它自己的圖像有1000x1000px。我環顧四周，發現了一些關於它的帖子，但沒有一個解決方案。謝謝。

來源

2015-10-13 flacoding

您可以顯示''#divImage''的CSS嗎？或者一個完整的可重複片段 – Kaiido

您是否嘗試過設置其質量？

var fullQuality = canvas.toDataURL("image/jpeg", 1.0); 
// data:image/jpeg;base64,/9j/4AAQSkZJRgABAQ...9oADAMBAAIRAxEAPwD/AD/6AP/Z" 
var mediumQuality = canvas.toDataURL("image/jpeg", 0.5); 
var lowQuality = canvas.toDataURL("image/jpeg", 0.1);

來源

2015-10-13 22:12:56

試過這個解決方案，現在我在ipad上得到一個黑盒子400x400而不是白盒子。一臺筆記本電腦的質量一樣差。看起來放大函數上的「canvas」參數已經處於低質量分辨率，所以如果我們將其設置爲1，它仍然是相同的質量差。 – flacoding

它似乎html2canvas提供模糊的圖像。 http://stackoverflow.com/questions/22803825/html2canvas-generates-blurry-images/22819006#22819006。試試rasterizeHTML.js作爲替代？ –

我不認爲這個會工作，因爲我試圖獲得DIV的打印屏幕。在div裏面，我有2個IMG（一個.png，另一個是base64）和一個串在一起。 – flacoding

HTML2Canvas空白圖像在iPad和筆記本電腦上

回答

相關問題