html canvas 随意画图,html5 canvas 画图的问题

最新推荐文章于 2023-02-07 23:03:39 发布

摄影吴师自通

最新推荐文章于 2023-02-07 23:03:39 发布

阅读量132

点赞数

文章标签： html canvas 随意画图

一共三个问题：

1、 change()函数是1秒钟执行一次，当中的console 语句也应该是每秒输出一次，但在本地执行发现，每次的console语句被执行情况

为什么会这样

2、怎样在每次画图之前清空之前的绘制结果，现在的是直接绘制在之前的效果上的。

3、当setTimeout 这么写时，报错如下

找了很久都没发现问题出在哪里，为什么会这样的错误

这几个问题我想了很久都到底哪里出了问题，希望各位大神能够解答下我的疑惑。谢谢！

canvas 倒数计时

var HEIGHT = 500;

var WIDTH = 700;

var r = 4;

var R = 5;

var MARGIN_TOP = 30;

var MARGIN_LEFT = 20;

window.onload = function () {

var canvas = document.getElementById("canvas");

var context = canvas.getContext("2d");

canvas.height = HEIGHT;

canvas.width = WIDTH;

var digit =

[

[0, 0, 1, 1, 1, 0, 0],

[0, 1, 1, 0, 1, 1, 0],

[1, 1, 0, 0, 0, 1, 1],

[0, 1, 1, 0, 1, 1, 0],

[0, 0, 1, 1, 1, 0, 0]

],//0

[

[0, 0, 0, 1, 1, 0, 0],

[0, 1, 1, 1, 1, 0, 0],

[0, 0, 0, 1, 1, 0, 0],

[1, 1, 1, 1, 1, 1, 1]

],//1

[

[0, 1, 1, 1, 1, 1, 0],

[1, 1, 0, 0, 0, 1, 1],

[0, 0, 0, 0, 0, 1, 1],

[0, 0, 0, 0, 1, 1, 0],

[0, 0, 0, 1, 1, 0, 0],

[0, 0, 1, 1, 0, 0, 0],

[0, 1, 1, 0, 0, 0, 0],

[1, 1, 0, 0, 0, 0, 0],

[1, 1, 0, 0, 0, 1, 1],

[1, 1, 1, 1, 1, 1, 1]

],//2

[

[1, 1, 1, 1, 1, 1, 1],

[0, 0, 0, 0, 0, 1, 1],

[0, 0, 0, 0, 1, 1, 0],

[0, 0, 0, 1, 1, 0, 0],

[0, 0, 1, 1, 1, 0, 0],

[0, 0, 0, 0, 1, 1, 0],

[0, 0, 0, 0, 0, 1, 1],

[1, 1, 0, 0, 0, 1, 1],

[0, 1, 1, 1, 1, 1, 0]

],//3

[

[0, 0, 0, 0, 1, 1, 0],

[0, 0, 0, 1, 1, 1, 0],

[0, 0, 1, 1, 1, 1, 0],

[0, 1, 1, 0, 1, 1, 0],

[1, 1, 0, 0, 1, 1, 0],

[1, 1, 1, 1, 1, 1, 1],

[0, 0, 0, 0, 1, 1, 0],

[0, 0, 0, 1, 1, 1, 1]

],//4

[

[1, 1, 1, 1, 1, 1, 1],

[1, 1, 0, 0, 0, 0, 0],

[1, 1, 1, 1, 1, 1, 0],

[0, 0, 0, 0, 0, 1, 1],

[1, 1, 0, 0, 0, 1, 1],

[0, 1, 1, 1, 1, 1, 0]

],//5

[

[0, 0, 0, 0, 1, 1, 0],

[0, 0, 1, 1, 0, 0, 0],

[0, 1, 1, 0, 0, 0, 0],

[1, 1, 0, 0, 0, 0, 0],

[1, 1, 0, 1, 1, 1, 0],

[1, 1, 0, 0, 0, 1, 1],

[0, 1, 1, 1, 1, 1, 0]

],//6

[

[1, 1, 1, 1, 1, 1, 1],

[1, 1, 0, 0, 0, 1, 1],

[0, 0, 0, 0, 1, 1, 0],

[0, 0, 0, 1, 1, 0, 0],

[0, 0, 1, 1, 0, 0, 0],

[0, 0, 1, 1, 0, 0, 0]

],//7

[

[0, 1, 1, 1, 1, 1, 0],

[1, 1, 0, 0, 0, 1, 1],

[0, 1, 1, 1, 1, 1, 0],

[1, 1, 0, 0, 0, 1, 1],

[0, 1, 1, 1, 1, 1, 0]

],//8

[

[0, 1, 1, 1, 1, 1, 0],

[1, 1, 0, 0, 0, 1, 1],

[0, 1, 1, 1, 0, 1, 1],

[0, 0, 0, 0, 0, 1, 1],

[0, 0, 0, 0, 1, 1, 0],

[0, 0, 0, 1, 1, 0, 0],

[0, 1, 1, 0, 0, 0, 0]

],//9

[

[0, 0, 0, 0],

[0, 1, 1, 0],

[0, 0, 0, 0],

[0, 1, 1, 0],

[0, 0, 0, 0],

[0, 0, 0, 0]

]//:

];

摄影吴师自通

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html canvas 随意画图,html5 canvas 画图的问题

一共三个问题：1、 change()函数是1秒钟执行一次，当中的console 语句也应该是每秒输出一次，但在本地执行发现，每次的console语句被执行情况为什么会这样2、怎样在每次画图之前清空之前的绘制结果，现在的是直接绘制在之前的效果上的。3、当setTimeout 这么写时，报错如下找了很久都没发现问题出在哪里，为什么会这样的错误这几个问题我想了很久都到底哪里出了问题，希望...
复制链接

扫一扫