zoukankan      html  css  js  c++  java
  • canvas生成图片,背景图不显示

    html代码

    <div id="echartsId" style="height:400px;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(); //点击触发下载
        }
    交流扣扣:1328542512
  • 相关阅读:
    Samba服务器搭建
    Nginx优化
    Nginx配置
    LNMP环境搭建
    mysql主从同步
    Linux系统文件权限体系详解
    强大的grep,sed和awk--用案例来讲解
    Linux中关机,重启,注销命令
    如何解决一个问题(一)
    Linux基础命令讲解(二)
  • 原文地址:https://www.cnblogs.com/codeDevotee/p/14680340.html
Copyright © 2011-2022 走看看