canvas生成图片，背景图不显示

 

 

html代码

<div id="echartsId" style="height:400px;width:1148px" class="svg-wrap">
                暂无数据
            </div>

 

 

js代码

　　var canvasId = "echartsId";

    
    var a = document.createElement('a');
    a.href = document.getElementById(canvasId).getElementsByTagName("canvas")[0].toDataURL();  //将画布内的信息导出为png图片数据
    a.download = "MapByMathArtSys";  //设定下载名称
    a.click(); //点击触发下载

 

背景图不显示的问题：

    var canvasId = "echartsId";var ctx = document.getElementById(canvasId).getElementsByTagName("canvas")[0];
  
    var image = new Image();
    image.src = encodeURI("/content/assist/images/watermark/1.png");
    image.onload = function () {
        var div_width = ctx.width;
        var div_height = ctx.height;
        var old_width = image.width;
        var old_height = image.height;
        var scale_x = (div_width - old_width) / 2;
        var scale_y = (div_height - old_height) / 2;


        ctx.getContext('2d').drawImage(image, scale_x, scale_y);

        var a = document.createElement('a');
        a.href = ctx.toDataURL();  //将画布内的信息导出为png图片数据
        a.download = "趋势图";  //设定下载名称
        a.click(); //点击触发下载
    }