h5笔记

最新推荐文章于 2025-08-21 18:41:24 发布

原创最新推荐文章于 2025-08-21 18:41:24 发布 · 219 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html5 #前端 #h5 #canvas

js等专栏收录该内容

11 篇文章

订阅专栏

两句必须有:var chess = document.getElementById("chess");
var context=chess.getContext('2d');
画横线:beginPath() moveTo() lineTo() strokeStyle lineWidth closePath() stroke()
context.strokeStyle="#BFBFBF"; 绘制颜色
context.moveTo(15,15); 起点
context.lineTo(15,435); 终点
context.stroke(); 开始绘制
添加图片:var logo = new Image() 定义图片
logo.src = "img.png"; 图片地址
logo.onload=function(){context.drawImage(logo,0,0,450,450);} 图片加载完开始绘制
画圆:context.beginPath(); 开始
context.arc(200,200,100,0,2*Math.PI,true); 园心半径绘制0到2π 顺逆时针
context.fillStyle="#000"; 填充的颜色
context.closePath(); 结束
context.fill(); 开始填充绘制

canvas:默认300*150

新增标签:
header nav article footer