js+html5绘制图片到canvas的方法


Posted in Javascript onJune 05, 2015

本文实例讲述了js+html5绘制图片到canvas的方法。分享给大家供大家参考。具体实现方法如下:

<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas" width="200" height="100"
style="border:1px solid #c3c3c3;">
Your browser does not support the HTML5 canvas tag.
</canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var img=new Image();
img.onload = function(){
ctx.drawImage(img,0,0);
};
img.src="img_flwr.png";
</script>
</body>
</html>

希望本文所述对大家的web程序设计有所帮助。

Javascript 相关文章推荐
JQuery 动画卷页 返回顶部 动画特效(兼容Chrome)
Feb 15 Javascript
让浏览器非阻塞加载javascript的几种方法小结
Apr 25 Javascript
jquery图形密码实现方法
Mar 11 Javascript
js仿黑客帝国字母掉落效果代码分享
Nov 08 Javascript
JavaScript组成、引入、输出、运算符基础知识讲解
Dec 08 Javascript
easyui datebox 时间限制,datebox开始时间限制结束时间,datebox截止日期比起始日期大的实现代码
Jan 12 Javascript
Bootstrap3 模态框使用实例
Feb 22 Javascript
Vue服务器渲染Nuxt学习笔记
Jan 31 Javascript
IE浏览器下JS脚本提交表单后,不能自动提示问题解决方法
Jun 04 Javascript
如何在wxml中直接写js代码(wxs)
Nov 14 Javascript
JsonServer安装及启动过程图解
Feb 28 Javascript
vue实践---根据不同环境,自动转换请求的url地址操作
Sep 21 Javascript
简介JavaScript中valueOf()方法的使用
Jun 05 #Javascript
jQuery插件jRumble实现网页元素抖动
Jun 05 #Javascript
js+html5获取用户地理位置信息并在Google地图上显示的方法
Jun 05 #Javascript
jquery插件NProgress.js制作网页加载进度条
Jun 05 #Javascript
JavaScript中toString()方法的使用详解
Jun 05 #Javascript
javascript实现倒计时并弹窗提示特效
Jun 05 #Javascript
jQuery插件EnPlaceholder实现输入框提示文字
Jun 05 #Javascript
You might like
PHP采集利器 Snoopy 试用心得
2011/07/03 PHP
php Imagick获取图片RGB颜色值
2014/07/28 PHP
php管理nginx虚拟主机shell脚本实例
2014/11/19 PHP
Yii2搭建后台并实现rbac权限控制完整实例教程
2016/04/28 PHP
PHP中用mysqli面向对象打开连接关闭mysql数据库的方法
2016/11/05 PHP
一个不错的应用,用于提交获取文章内容,不推荐用
2007/03/03 Javascript
js实现单行文本向上滚动效果实例代码
2013/11/28 Javascript
移动节点的jquery代码
2014/01/13 Javascript
js判断游览器类型及版本号的代码
2014/05/11 Javascript
JavaScript对象数组的排序处理方法
2015/10/21 Javascript
纯JavaScript代码实现文本比较工具
2016/02/17 Javascript
AngularJS实用开发技巧(推荐)
2016/07/13 Javascript
jQuery轮播图效果精简版完整示例
2016/09/04 Javascript
对于Javascript 执行上下文的全面了解
2017/09/05 Javascript
浅谈vue2 单页面如何设置网页title
2017/11/08 Javascript
AngularJS实现的简单拖拽功能示例
2018/01/02 Javascript
[01:21:58]守擂赛DOTA2第一周决赛
2020/04/22 DOTA
Python使用pylab库实现画线功能的方法详解
2017/06/08 Python
ubuntu 16.04下python版本切换的方法
2019/06/14 Python
简单了解python协程的相关知识
2019/08/31 Python
pytorch sampler对数据进行采样的实现
2019/12/31 Python
Python求平面内点到直线距离的实现
2020/01/19 Python
python rolling regression. 使用 Python 实现滚动回归操作
2020/06/08 Python
Python3基于print打印带颜色字符串
2020/07/06 Python
Python requests及aiohttp速度对比代码实例
2020/07/16 Python
Python3+Appium安装及Appium模拟微信登录方法详解
2021/02/16 Python
多重CSS背景动画实现方法示例
2014/04/04 HTML / CSS
HTML5使用DOM进行自定义控制示例代码
2013/06/08 HTML / CSS
Html5在手机端调用相机的方法实现
2020/05/13 HTML / CSS
Tomcat中怎么使用log4j输出所有的log
2016/07/07 面试题
会议邀请书范文
2014/02/02 职场文书
《老王》教学反思
2014/02/23 职场文书
2015年卫生院健康教育工作总结
2015/07/24 职场文书
如何用JavaScript实现一个数组惰性求值库
2021/05/05 Javascript
go mod 安装依赖 unkown revision问题的解决方案
2021/05/06 Golang
python ConfigParser库的使用及遇到的坑
2022/02/12 Python