const bus = new Vue()
Vue.prototype.$bus = bus
export function exportImg(myChart, name) {
var img = new Image()
img.src = myChart.getDataURL({
type: 'png',
pixelRatio: 1,
backgroundColor: '#fff'
})
img.onload = () => {
var canvas = document.createElement('canvas')
canvas.width = img.width
canvas.height = img.height
var ctx = canvas.getContext('2d')
ctx.drawImage(img, 0, 0)
var dataURL = canvas.toDataURL('image/png')
var a = document.createElement('a')
var event = new MouseEvent('click')
a.download = name
a.href = dataURL
a.dispatchEvent(event)
}
}
export function downFileBlob(fileData, fileType, fileName) {
let blobData = fileData
let contentType = ''
if (fileType === 'image') {
let parts = fileData.split(';base64,');
contentType = parts[0].split(':')[1];
let raw = window.atob(parts[1]);
let rawLength = raw.length;
let uInt8Array = new Uint8Array(rawLength);
for (let i = 0; i < rawLength; ++i) {
uInt8Array[i] = raw.charCodeAt(i);
}
blobData = uInt8Array
} else if (fileType === 'excel') {
contentType = 'application/vnd.ms-excel'
}
const link = document.createElement('a')
let blob = new Blob([blobData], {
type: contentType
})
link.style.display = 'none'
link.href = URL.createObjectURL(blob)
link.download = fileName
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
}
mounted() {
this.$bus.$on('exportImage', this.exportImage)
},
beforeDestroy() {
this.$bus.$off('exportImage', this.exportImage)
},
methods: {
exportImage(res) {
const fileName = res.fileName || 'img'
if (this.chart) {
downFileBlob(this.chart.getDataURL(), 'image', fileName)
}
},
}
this.$bus.$emit('exportImage', 'image', { fileName: '导出之后文件的名称' })