canvas基础绘制-绚丽时钟

Posted 喵嘻嘻

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了canvas基础绘制-绚丽时钟相关的知识,希望对你有一定的参考价值。

效果图:

与canvas基础绘制-绚丽倒计时的代码差异:

// var endTime = new Date();//const声明变量,不可修改,必须声明时赋值;
// endTime.setTime( endTime.getTime() + 3600*1000);//当前时间向后一小时;
var curShowTimeSeconds = 0;
function getCurrentShowTimeSeconds() {
    var curTime = new Date();//获取目前时间;
    // var ret = endTime.getTime()-curTime.getTime();
    // ret = Math.round(ret/1000);//获取秒数差值;
    var ret = curTime.getHours()*3600 + curTime.getMinutes()*60+curTime.getSeconds();
    return ret>=0?ret:0;
}

 

以上是关于canvas基础绘制-绚丽时钟的主要内容,如果未能解决你的问题,请参考以下文章

15 个超绚丽的 HTML5 时钟动画

canvas绘制一个数字时钟

Canvas绘制时钟

小任务之Canvas绘制时钟

应用canvas绘制动态时钟--每秒自动动态更新时间

自定义控件Paint,Canvas 基础用法 - Path函数大全,Canvas绘制基本几何图形