2月9日

2019-02-09  本文已影响0人  无意爱昵

canvas实现炫酷小时钟(二)

ctx = myCanvas.getcontext('2d');  获取上下文对象,继而ctx.strokeStyle  = '#00ffff'画笔颜色,ctx.lineWidth = 17;线宽,ctx.shadowBlur =15;阴影模糊系数,ctx.shadowColor = '#00ffff';阴影颜色。

绘制逻辑写在renderTime()函数里,其中用原生js的方法获取各时间对象,var date = new Date( ); var today = date.toDateString( );

var time = date.toLocalTimeString( );

var hrs = time.getHours();

var min = time.getMinutes();

var sec = time.getSeconds();

var mil = time.getMilliseconds();

先设置画布的背景色,为径向渐变。

gradient = ctx.createRadialGradient(250,250,5,250,250,300);

上一篇下一篇

猜你喜欢

热点阅读