Canvas 绘制时钟_技术问答

首页免费课 Canvas 绘制时钟问答

Canvas 绘制时钟

                
                Silva Zhou
            Web前端工程师

                    查看讲师更多课程 
                    Silva Zhou讲师的其他课程
                
Requirejs和自动打包
中级·14715
免费课程
                                
                难度中级
            
                时长 1小时 0分
            
                学习人数
            
综合评分9.73
                            141人评价
                        查看评价
                                9.8
                                内容实用
                            
                                9.7
                                简洁易懂
                            
                                9.7
                                逻辑清晰

全部评论问答未解决精华

再学一课时吧_加油

有趣这个点都没把我讲困

2017-05-15

summerstarry

一帮人嫌这嫌那，你能学会我真是信了你的邪

1 3-1 Canvas 时钟外边框圆

2017-05-12

阳光_98

如果大家是用谷歌浏览器的没有显示出圆，那么可以尝试一下将绘制方法即<script src=""></script>放在body中的<canvas></cancas> 下面，因为chrome下需要文档载入完成后才能获得canvas对象

4 3-1 Canvas 时钟外边框圆

2017-05-10

慕移动5443360

跟老师写的一毛一样它竟然给我报语法错误来来回回检查了好几遍也没找着哪错了
报错的是下面这两行 :var x = Math.cos(rad) * (r - 30);
drawBackground();
求大神指导啊

0 3-2 Canvas绘制时钟内容

2017-05-09

慕后端9458234

老师讲的很好！希望这样的视频能多一些

0 4-2 Canvas时钟特效

2017-05-08

慕后端9458234

如果用DW的话，function函数里面应该包含'use strict';不然会报错

2 3-1 Canvas 时钟外边框圆

2017-05-07

小佳佳QAQ

思路很清晰，但是弧度还是没理解，将就着用了。

0 2-1 Canvas 绘制时钟--几何模型

2017-04-24

天蓝99

沈阳在吗?

0 1-1 Canvas时钟展示

2017-04-20

qq_远方_38

幸亏还记得cos sin tain，虽然数学差的没谁了比零分多点哈哈哈。

1 2-1 Canvas 绘制时钟--几何模型

2017-04-17

Shaylynne

感谢老师的精彩教学，好受用。嘻嘻嘻，谢谢。

0 4-2 Canvas时钟特效

2017-04-13

CuteBlackCat

不需要用clearRect()清除的，只需要将每个用ctx.save()和ctx.restore()包起来就可以了。

1 4-1 Canvas动态的时分秒

2017-04-12

小董君同学

Demo演示地址：https://taosang1992.github.io/Javascript-Demo/clock.html
Demo代码地址：https://github.com/taosang1992/Javascript-Demo/blob/gh-pages/clock.js

0 4-2 Canvas时钟特效

2017-04-12

小董君同学

var canvas = document.getElementById('clock');
var ctx = canvas.getContext('2d');
var width = canvas.width;
var height = canvas.height;
var r = width/2;
function drawCircle(){
ctx.translate(r,r); //转移绘制原点
ctx.beginPath();
ctx.arc(0,0,r,0,2*Math.PI);
ctx.stroke();
}
drawCircle();

0 3-1 Canvas 时钟外边框圆

2017-04-12

Yxhsea

源代码：https://github.com/BlueSimle/canvas_clock

1 1-1 Canvas时钟展示

2017-04-10

Yxhsea

源代码：https://github.com/BlueSimle/canvas_clock

0 4-2 Canvas时钟特效

2017-04-10

首页上一页 8 9 10 11 12 13 14 下一页尾页

开始学习

课程须知: javascript基础知识

老师告诉你能学到什么？: 1、几何知识 2、从零学习canvas

微信扫码，参与3人拼团

热搜

最近搜索清空

Canvas 绘制时钟