编程 Javascript

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程序设计有所帮助。

- Author -

pythoner

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

高性能WEB开发 flush让页面分块,逐步呈现 flush让页面分块,逐步呈现

Jun 19 Javascript

Juqery Html(),append()等方法的Bug解决方法

Dec 13 Javascript

express的中间件cookieParser详解

Dec 04 Javascript

JavaScript实现的字符串replaceAll函数代码分享

Apr 02 Javascript

javascript中的正则表达式使用详解

Aug 30 Javascript

JavaScript获取浏览器信息的方法

Nov 20 Javascript

基于Vuejs实现购物车功能

Aug 02 Javascript

表单元素值获取方式js及java方式的简单实例

Oct 15 Javascript

基于Datatables跳转到指定页的简单实例

Nov 09 Javascript

bootstrap table支持高度百分比的实例代码

Feb 28 Javascript

使用next.js开发网址缩短服务的方法

Jun 17 Javascript

vant 时间选择器--开始时间和结束时间实例

Nov 04 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

全国FM电台频率大全 - 5 内蒙古自治区

2020/03/11 无线电

使用php发送有附件的电子邮件-(PHPMailer使用的实例分析)

2013/04/26 PHP

php中运用http调用的GET和POST方法示例

2014/09/29 PHP

PHP实现的统计数据功能详解

2016/12/06 PHP

jQuery的one()方法用法实例

2015/01/19 Javascript

jQuery拖拽插件gridster使用指南

2015/04/21 Javascript

JS代码防止SQL注入的方法(超简单)

2016/04/12 Javascript

Angular.JS判断复选框checkbox是否选中并实时显示

2016/11/30 Javascript

bootstrap组件之导航组件使用方法

2017/01/19 Javascript

angularjs下拉框空白的解决办法

2017/06/20 Javascript

js实现rem自动匹配计算font-size的示例

2017/11/18 Javascript

浅谈vuejs实现数据驱动视图原理

2018/02/23 Javascript

JS实现分页导航效果

2020/02/19 Javascript

12 种使用Vue 的最佳做法

2020/03/30 Javascript

解决vue.js中settimeout遇到的问题(时间参数短效果不稳定)

2020/07/21 Javascript

[15:39]教你分分钟做大人：龙骑士

2014/10/30 DOTA

python使用os.listdir和os.walk获得文件的路径的方法

2017/12/16 Python

Django框架使用内置方法实现登录功能详解

2019/06/12 Python

python修改FTP服务器上的文件名

2019/09/11 Python

在pycharm中debug 实时查看数据操作(交互式)

2020/06/09 Python

最新PyCharm 2020.2.3永久激活码(亲测有效)

2020/11/26 Python

纯css3实现思维导图样式示例

2018/11/01 HTML / CSS

香港草莓网土耳其网站：Strawberrynet TR

2017/03/02 全球购物

经济管理毕业生求职信

2014/03/15 职场文书

安全保证书范文

2014/04/29 职场文书

运动会横幅标语

2014/06/17 职场文书

植物生产学专业求职信

2014/08/08 职场文书

党政领导班子民主生活会整改措施

2014/09/18 职场文书

群众路线教育实践活动自我剖析思想汇报

2014/10/04 职场文书

晋江市人民政府党组群众路线教育实践活动整改方案

2014/10/25 职场文书

求职简历自我评价怎么写

2015/03/10 职场文书

电子商务专业求职信范文

2015/03/19 职场文书

2016年“12.4”法制宣传日活动总结

2016/04/01 职场文书

2019消防宣传标语！

2019/07/10 职场文书

创业计划书之面包店

2019/09/17 职场文书

python使用shell脚本创建kafka连接器

2022/04/29 Python