Canvas 应用 互动版

绘制分钟刻度


绘制分钟刻度

  ctx.save(); // 记录旋转画布之前初始状态
  ctx.lineWidth = 5;
  for (i=0;i<60;i++){ // 绘制分钟刻度
    if (i%5!=0) {
      ctx.beginPath();
      ctx.moveTo(117,0);
      ctx.lineTo(120,0);
      ctx.stroke();
    }
    ctx.rotate(Math.PI/30); // 旋转画布绘制刻度
  }
  ctx.restore(); // 恢复初始状态,未旋转前