使用如下代码,获得Canvas图像对应的data URI,也就是平常我们所说的base64地址

var dataUrl = document.getElementById("canvasId").toDataURL("image/png");

然后将dataUrl作为参数,调用下面的方法就可以直接下载图片了。

function downLoad(url){
var oA = document.createElement("a");
oA.download = '';// 设置下载的文件名,默认是'下载'
oA.href = url;
document.body.appendChild(oA);
oA.click();
oA.remove(); // 下载之后把创建的元素删除
}
downLoad(dataUrl);

页面上下载canvas中的内容作为图片的更多相关文章

  1. Android开发 ---从互联网上下载文件,回调函数,图片压缩、倒转

     Android开发 ---从互联网上下载文件,回调函数,图片压缩.倒转 效果图: 描述: 当点击“下载网络图像”按钮时,系统会将图二中的照片在互联网上找到,并显示在图像框中 注意:这个例子并没有将图 ...

  2. 基于bshare分享平台,在一个页面上实现多个不同内容的web分享

    <!--引入bshare SDK--><script type="text/javascript" charset="utf-8" src=& ...

  3. 遍历页面上主从表中从table中的内容

    //如果在建VL的时候没有建访问器.从主表行拿到从表VO的行级不太好搞的 OAAdvancedTableBean innerTable = (OAAdvancedTableBean)webBean.f ...

  4. 在jsp页面动态添加数据库中的内容

    工具:myeclipse+oracle11g 1.首先新建一个jsp页面. 2.在src目录下新建实体类User.java 3.创建BaseDao用来链接数据库 4.在pl/sql中创建存储过程 5. ...

  5. 读取hdfs目录,并在web页面上展示文件里的内容

    最终效果图 目录树实体类: /** * @Author: DaleyZou * @Description: hdfs 目录结构的实体类,用于展示目录树的支撑操作 * @Date: Created in ...

  6. 如何利用CSS中的ime-mode用来控制页面上文本框中的全角/半角输入

    css 之 ime-mode语法:ime-mode : auto | active | inactive | disabled取值:auto : 默认值.不影响ime的状态.与不指定 ime-mode ...

  7. 对于页面上下载pdf或者excel按钮的实现

    这个主要是通过      window.open(url + params) url后台给存放的路径,params是参数

  8. wpf 保存控件中的内容为图片格式

    黄色的是wpf控件的名称! //保存到特定路径            FileStream fs = new FileStream(@"C:\image.png", FileMod ...

  9. Raphaël 是一个小型的 JavaScript 库,用来简化在页面上显示向量图的工作。你可以用它在页面上绘制各种图表、并进行图片的剪切、旋转等操作。

    点这里 在线效果演示:http://raphaeljs.com/pie.html http://raphaeljs.com github: https://github.com/DmitryBaran ...

随机推荐

  1. 你要的SSM(Spring+Springmvc+Mybatis)小项目来了!!!

    SSM-Maven-Heima 这是一个使用 SSM(Spring+Springmvc+Mybatis)框架的商城小项目,使用Maven构建项目,以MySQL为数据库系统,Redis的缓存服务器(并不 ...

  2. inkscope完整安装配置

    准备centos7基础系统 首先安装基础系统centos7 在安装选项那里选择base web server ,选择其他的也可以,选择mini安装会缺很多常用的软件包,后续需要一个个安装比较麻烦 关闭 ...

  3. 认识socketserver

    1.服务端 # 如果socket起一个tcp服务,在同一个时间只能和一个客户端通信 # 如果socketserver起一个服务,在同一个时间就可以和多个客户端通信了 # socketserver # ...

  4. 如何个性化定制iview中的table样式

    使用renderHeader.render函数 例子: column:[ {}, ..., { title:'较年初占比变化', key:''lastYearChange, renderHeader: ...

  5. 深度分析:面试阿里,字节99%会被问到Java类加载机制和类加载器

    1. 类加载机制 所谓类加载机制就是JVM虚拟机把Class文件加载到内存,并对数据进行校验,转换解析和初始化,形成虚拟机可以直接使用的Jav类型,即Java.lang.Class. 2. 类加载的过 ...

  6. MindManager教程:高中数学函数思维导图怎么画

    说起函数,大家应该都不陌生吧,函数不论是在初中还是在高中都是需要重点学习的知识点,不仅仅是重点,更是作为难点曾出现在高考最后一道大题中.那今天我们就来做一个函数思维导图,来简单地了解一下关于函数的一些 ...

  7. word教程字体和段落设置

    放大/缩小字号:1.选中文字-点击"大A"或"小A" 2.同时摁着ctrl+shift+>/ctrl+shift+<即可 设置标题与正文间距:鼠标放 ...

  8. appium服务器参数

    appium服务器初始化参数 Appium服务器初始化参数(功能) 设置能力 能力参数项 获取appPackage与appActivity 查看当前活动名称 使用uiautomatorviewer定位 ...

  9. 以注解的方式实现api和provider

    1.provider import com.alibaba.dubbo.config.annotation.Service; import facade.EchoService; import com ...

  10. HTML的基本术语

    一.HTML含义1.根据W3C定义,HTML全称Hyper Text Markup Language: 超文本标记语言,用于定义文档的内容结构,该语言书写的代码通常会被浏览器解析执行.二.css含义1 ...