为了账号安全,请及时绑定邮箱和手机立即绑定

学习canvas,记录canvas的API

标签:
Html5
var canvasDom = document.getElementById("canvas");

// 获取canvas上下文
var context = canvasDom.getContext("2d");
// 画笔的起点
context.moveTo(100,100);
// 画笔画至的点
context.lineTo(700,700);
// 绘制
context.stroke();
// 开始新的图形画起
context.beginPath();
// 封闭图形(与beginPath配对使用)
context.closePath();
/******/
var image = new Image();
image.src = "...";
image.onload = function(){
     // drawImage(image,100,100)指定图片原有的尺寸平铺在画布上
     //context.drawImage(image,100,100);

     // drawImage(image,0,0,canvas.width,canvas.height)使图片铺满画布
     //context.drawImage(image,0,0,canvas.width,canvas.height);

     // drawImage(image,50,50,200,200,300,300,500,500);指定图片中的某部分(50,50,200,200)平铺在画布的某位置上(300,300,500,500)
     context.drawImage(image,50,50,200,200,300,300,500,500);
}
点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消