画布实例

实现了鼠标可以在画板上绘制图像，且可以重置和保存为png。原理是监听鼠标的操作事件，通过不断的设定canvas的绘制起点位置从而实现连续的鼠标绘制

实现效果如下：
在这里插入图片描述


Document

钟表实例

原理是通过requestAnimationFrame功能每秒循环渲染一次画布，再通过 new Date();不停获取当前时间，变换指针的角度位置

        // 定义一个回调函数function animate(time){// 更新动画状态update(time);// 绘制动画帧draw();// 请求下一次动画帧window.requestAnimationFrame(animate);}// 开始动画循环window.requestAnimationFrame(animate);

实现效果如下：
请添加图片描述


Document

总结

感觉canvas和python的小乌龟绘图差不多，但是能够实现的多了很多,尤其是动画方面
自己还需要提升阅读英文原文档的能力

上一篇：早晨爬山,回家睡觉后发生一系列怪梦

下一篇：关于人间亲情的内容？

【canvas】简易小实例（钟表和画布）

文章目录

画布实例

钟表实例

总结

相关内容

热门资讯