Welkin_qing的博客

一、体现曲线的绘制 首先需要明白角度和弧度的关系： 一个角度等于π/180个弧度 1. 根据点动成线的概念绘制圆弧（利用函数） 比如： y = x/2 y = (x + 2) ^2 y = sin(x) 在这里我们使用三角函数做示例 or(var i = 1 ; i < 600 ; i ++){ var x = i; var y = 50*Math.s...

一、 绘制网格 绘制网格 网格的大小 网格的条数，横线条数，竖线条数，画布高度 网格的条数我们根据画布的大小来对网格大小进行相除，取整 <script> var myCanvas = document.querySelector('canvas'); var ctx = myCanvas.getContext('2d'); /*1.绘制网格*/ /...

一、基本体验Canvas绘图 1. 基本操作 a. 准备画布 使用canvas标签 注意： 画布是白色的 而且默认300*150，所以我们可以在style样式里给canvas加上边框 设置画布的大小，需要使用内敛式设置，不建议在style样式进行设置 <style> canvas{ border: 1px solid #ccc; ...

一、 帧动画 绘制图片 -----使用drawImage（） 三个参数drawImage（img, x,y） img 图片对象，Canvas对象，video对象 x，y 图片绘制的左上角 五个参数 drawImage（img, x, y, w, h） img 图片对象，Canvas对象，video对象 x，y 图片绘制的左上角 w，h图片绘制尺寸设置（图片缩放，不是截取） 九个参数 ...