function fImageToCanvas(image){
  var oCanvas = document.createElement("canvas");
  oCanvas.width = image.width;
  oCanvas.height = image.height;
  oCanvas.getContext("2d").drawImage(image,0,0);
  return oCanvas;
}

function fCanvasToImage(canvas){
  var oImage = new Image();
  image.src = canvas.toDataURL("image/png");
  return image;
}

参考:http://blog.csdn.net/renfufei/article/details/9855519

Canvas与Image互转的更多相关文章

  1. canvas和图片互转

    原文:http://www.jb51.net/html5/160920.html 这么神奇么?先记录一下. 使用JavaScript将图片拷贝进画布 要想将图片放入画布里,我们使用canvas元素的d ...

  2. 让自己也能使用Canvas

    <canvas> 是 HTML5 新增的元素,可使用JavaScript脚本来绘制图形.例如:画图,合成照片,创建动画甚至实时视频处理与渲染. 兼容性方面,除了一些骨灰级浏览器IE6.IE ...

  3. canvas三角函数应用

    这个是圆圈旋转的简单案例 var canvas=document.getElementById("canvas"); var cxt=canvas.getContext(" ...

  4. html5 canvas画图之图形随拖动而复制(有操作指示)

    学习html5 canvas,写了一个小练习来加深理解,可以实现图形随拖动而复制. <!DOCTYPE html> <html> <head> <meta c ...

  5. canvas压缩、裁切图片和格式转换的方法

    按照大小压缩图片,或者按照特定分辨率裁切图片,转为blob数据.自动处理ios中可能存在的照片偏差90°问题. 例如,获取300*300大小的头像,实现以下效果: 使用方式: <!-- 引入js ...

  6. html5 canvas常用api总结(三)--图像变换API

    canvas的图像变换api,可以帮助我们更加方便的绘画出一些酷炫的效果,也可以用来制作动画.接下来将总结一下canvas的变换方法,文末有一个例子来更加深刻的了解和利用这几个api. 1.画布旋转a ...

  7. 【探索】利用 canvas 实现数据压缩

    前言 HTTP 支持 GZip 压缩,可节省不少传输资源.但遗憾的是,只有下载才有,上传并不支持.如果上传也能压缩,那就完美了.特别适合大量文本提交的场合,比如博客园,就是很好的例子. 虽然标准不支持 ...

  8. 简单入门canvas - 通过刮奖效果来学习

    一 .前言 一直在做PC端的前端开发,从互联网到行业软件.最近发现移动端已经成为前端必备技能了,真是不能停止学习.HTML5新增的一些东西,canvas是用的比较多也比较复杂的一个,简单的入门了一下, ...

  9. 获取Canvas当前坐标系矩阵

    前言 在我的另一篇博文 Canvas坐标系转换 中,我们知道了所有的平移缩放旋转操作都会影响到画布坐标系.那在我们对画布进行了一系列操作之后,怎么再知道当前矩阵数据状态呢. 具体代码 首先请看下面的一 ...

随机推荐

  1. Java开源GIS系统

     uDig  基于Eclipse RCP的uDig开源项目既是一个GeoSpatial应用程序也是一个平台开发者可通过这个平台来创建新的在uDig基础上衍生的应用程序,uDig是Web地理信息系统的一 ...

  2. Caffe学习系列(18): 绘制网络模型

    python/draw_net.py, 这个文件,就是用来绘制网络模型的.也就是将网络模型由prototxt变成一张图片. 在绘制之前,需要先安装两个库 1.安装GraphViz # sudo apt ...

  3. 在opencv3中进行图片人脸检测

    在opencv中,人脸检测用的是harr或LBP特征,分类算法用的是adaboost算法.这种算法需要提前训练大量的图片,非常耗时,因此opencv已经训练好了,把训练结果存放在一些xml文件里面.在 ...

  4. 20135316王剑桥 linux第二周课实验笔记

    Linux中命令格式为: command [options选项] [arguments参数] //中括号代表是可选的,即有些命令不需要选项也不需要参数 ls或ls .显示是当前目录的内容,这里“.”就 ...

  5. Linux下OpenSSL的安装与使用

    Linux下OpenSSL的安装与使用 OpenSSL简介 OpenSSL是一个SSL协议的开源实现,采用C语言作为开发语言,具备了跨平台的能力,支持Unix/Linux.Windows.Mac OS ...

  6. iOS技巧,宏定义

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAnoAAAPCCAYAAADvRHWgAAAAAXNSR0IArs4c6QAAAZ1pVFh0WE1MOm

  7. 推荐一款超强大的基于Angularjs的自动完成(Autocomplete)标签及标签组插件–ngTagsInput

    前言 今天利用中午午休时间,给大家分享推荐一款基于Angularjs的自动完成(Autocomplete)标签及标签组插件--ngTagsInput,功能超强大的.不信,你试试就知道^_^... Au ...

  8. [转]Java中的private、protected、public和default的区别

    原文地址:http://my.oschina.net/u/1169535/blog/403589 (1)对于public修饰符,它具有最大的访问权限,可以访问任何一个在CLASSPATH下的类.接口. ...

  9. WPF--调用线程必须为 STA,因为许多 UI 组件都需要(转载)

    自VS2005开始,UI元素在不同线程中访问就受到限制了,当然你也可以解除这种限制 以下提供Framework3.0的解决方案发: public partial class Window1 : Win ...

  10. Tomcat 使用说明

    Tomcat下有7个目录,分别是bin,conf,lib,logs,temp,webapps,work 目录 Tomcat根目录在tomcat中叫<CATALINA_HOME> 1.< ...