1.bizCharts自帶函數(shù)
handleClick = () => {
const chartIns = this.state.chartIns;
chartIns.downloadImage();
}
2.獲取canvas dom元素,模擬a元素點(diǎn)擊
handleClick = () => {
const chartIns = this.state.chartIns;
var image = chartIns.get('canvas')._cfg.el.toDataURL("image/jpeg");
var $a = document.createElement('a');
$a.setAttribute("href", image);
$a.setAttribute("download", "");
$a.click();
}
3.重繪canvas俩垃,設(shè)置背景為白色
handleClick = () => {
const chartIns = this.state.chartIns;
const canvas = document.createElement('canvas');
canvas.height = 350;
canvas.width = 1000;
const ctx = canvas.getContext('2d');
ctx.fillStyle = "#fff";
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.drawImage(chartIns.get('canvas')._cfg.el, 0, 0);
var image = canvas.toDataURL("image/jpeg");
var $a = document.createElement('a');
$a.setAttribute("href", image);
$a.setAttribute("download", this.props.title);
$a.click();
}