var hourNumbers=[3,4,5,6,7,8,9,10,11,12,1,2];
ctx.font=18*rem+'px Aprial';
ctx.textAlign='center';
ctx.textBaseline='middle';
hourNumbers.forEach(function(number,i){
var rad=2*Math.PI/12*i;
var x=Math.cos(rad)*(r-30*rem);
var y=Math.sin(rad)*(r-30*rem);
ctx.fillText(number,x,y);
});
for(var i = 0;i < 60 ;i++){
var rad=2*Math.PI/60*i;
var x=Math.cos(rad)*(r-18*rem);
var y=Math.cos(rad)*(r-18*rem);
ctx.beginPath();
if(i%5==0)
{ctx.fillStyle='#000';
ctx.arc(x,y,2*rem,0,2*Math.PI,false);
ctx.fill();
}
else{
ctx.fillStyle='#ccc';
ctx.arc(x,y,2*rem,0,2*Math.PI,false);
ctx.fill();
}
ctx.fill();
}
}
for(var i = 0;i < 60 ;i++){
var rad=2*Math.PI/60*i;
var x=Math.cos(rad)*(r-18*rem);
var y=Math.cos(rad)*(r-18*rem);
ctx.beginPath();
------------ 分割线 -------------
上面是画刻度点的部分,y = Math.sin(rad) * (r - 18 * rem); 而不是cos