1 實(shí)現(xiàn)echarts生成圖片
var charts = document.createElement("div");
// 5. 圖表配置
var myChart = echarts.init(charts);
var option;
option = {
xAxis: {
type: 'category',
data: this.edata[i].content.xAxis
},
yAxis: {
type: 'value'
},
series: this.edata[i].content.series
};
option && myChart.setOption(option);
// 將圖表導(dǎo)出為 base64 編碼的圖像數(shù)據(jù)
const base64Image = myChart.getDataURL({ type: 'png', pixelRatio: 2 });
console.log(base64Image,'base64Image'); // 在控制臺(tái)輸出 base64 編碼的圖像數(shù)據(jù)
this.downloadimg(base64Image,'文件')
2.base64下載
downloadimg(file, name) {
let parts = file.split(';base64,')
let contentType = parts[0].split(':')[1]
let raw = window.atob(parts[1]) // 解碼base64得到二進(jìn)制字符串
let rawLength = raw.length
let uInt8Array = new Uint8Array(rawLength) // 創(chuàng)建8位無(wú)符號(hào)整數(shù)值的類(lèi)型化數(shù)組
for (let i = 0; i < rawLength; ++i) {
uInt8Array[i] = raw.charCodeAt(i) // 數(shù)組接收二進(jìn)制字符串
}
// 創(chuàng)建blob對(duì)象設(shè)置文件類(lèi)型
var blob = new Blob([uInt8Array], { type: contentType });
console.log(blob);
var aLink = document.createElement("a");
// 下載的文件名稱(chēng)
aLink.download = name + '.' + contentType.split('/')[1];
aLink.href = URL.createObjectURL(blob);
// 執(zhí)行點(diǎn)擊事件進(jìn)行下載
aLink.click()
},
