將Google圖表下載爲jpeg而不是png？

我目前下載谷歌圖表與下面的代碼巴布亞新幾內亞：將Google圖表下載爲jpeg而不是png？

var imgUri = my_chart.getImageURI(); 
var url = window.URL || window.webkitURL; 
linkPNG = document.createElement("a"); 
linkPNG.href = imgUri; 
linkPNG.download = title+".png"; 
link.click();

它工作正常。不幸的是，我的用戶需要一個JPEG而不是PNG，而我的平常

var imgURL = my_chart.toDataURL("image/jpeg");

似乎不適用於谷歌圖表。如何將圖表下載爲.jpg而不是.png？

來源

2015-05-01 BarthesSimpson

的MDN API文檔具有用於轉換圖像的很好的例子。你只需要修改一下代碼。 https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL – SpiderPig

花一些時間通過可視化庫的混淆源之後，我已經確定它會更容易，只是重新從數據URI圖像，而不是試圖去改變原來的出口型。您可以使用圖像加載數據URI，將其繪製在畫布上，然後將其轉換回數據URI。

var img = new Image(); 
img.addEventListener('load', function() { 
    var canvas = document.createElement('canvas'); 
    canvas.width = img.width; 
    canvas.height = img.height; 
    var ctx = canvas.getContext('2d'); 
    ctx.fillStyle = 'white'; 
    ctx.fillRect(0, 0, img.width, img.height); 
    ctx.drawImage(img, 0, 0); 
    var link = document.createElement('a'); 
    link.href = canvas.toDataURL('image/jpeg'); 
    link.download = title + '.jpg'; 
    link.click(); 
}); 
img.src = my_chart.getImageURI();

某些錯誤處理可能不會是一個壞主意。

來源

2015-05-01 05:17:46 trumank

我正要說，你需要選擇的，而不是直接在畫布上繪製在畫布的2D上下文，然後你編輯它的時間。這很好。我唯一要補充的是，由於透明度問題，我添加了'ctx.fillStyle =「＃FFFFFF」; ctx.fillRect（0,0，canvas.width，canvas.height）;''之前ctx.drawImage（IMG，0,0）' – BarthesSimpson

此外，您需要更改'link.download =標題+ 'png格式'; 'to link.download = title +'.jpg';' – BarthesSimpson

啊，好點。實際上，我是寫一些代碼帆布我的一個項目時，我意識到，我忘了畫在我的答案我昨天寫的背景下等我回來解決它。真是巧合。 – trumank

將Google圖表下載爲jpeg而不是png？

回答

相關問題