https://github.com/kylebing/animate-clock-canvas

Analog clock, js, canvas 模拟时钟页面
https://github.com/kylebing/animate-clock-canvas

Last synced: 6 months ago
JSON representation

Analog clock, js, canvas 模拟时钟页面

• Host: GitHub
• URL: https://github.com/kylebing/animate-clock-canvas
• Owner: KyleBing
• Created: 2024-08-12T09:25:46.000Z (over 1 year ago)
• Default Branch: master
• Last Pushed: 2024-08-26T03:09:39.000Z (over 1 year ago)
• Last Synced: 2025-04-03T04:34:05.574Z (10 months ago)
• Language: JavaScript
• Homepage: http://kylebing.cn/tools/clock-a
• Size: 97.7 KB
• Stars: 30
• Watchers: 1
• Forks: 3
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          




# Canvas Analog Clock

显示模拟时钟的 canvas 网页小应用。

![3 7m](https://github.com/user-attachments/assets/f0c9b665-c728-4906-860a-73249adb983d)

### 可选参数：

| 参数         | 说明         | 默认值       | 可能的值                                    |

|------------|------------|-----------|-----------------------------------------|

| set        | 表盘不同的类型    | `0`       | `0`, `1`                                |

| theme      | 主题         | `white`   | `white` 白色 `black` 黑色                   |

| type       | 指针类型       | `rounded` | `rect` 方块 `pointer` 尖形指针 `rounded` 圆形指针 |

| number     | 刻度标识       | `ALB`     | `ALB` 阿拉伯数字 `LM` 罗马数字  (大小写均可)          |

| skiphour   | 跳过小时数显示分钟数 | `0`       | `0` 不作处理 `1` 跳过                         |

| zoomsecond | 放大显示秒数     | `0`       | `0` 否 `1` 是                             |

| showinfo   | 显示参数值      | `0`       | `0` 否 `1` 是                             |

| showdate   | 显示日期、星期    | `1`       | `0` 否 `1` 是                             |

| showshadow | 显示指针阴影     | `1`       | `0` 否 `1` 是                             |

例子：

- 白色 [http://kylebing.cn/tools/clock-a?theme=white](http://kylebing.cn/tools/clock-a?theme=white)

- 黑色 [http://kylebing.cn/tools/clock-a?theme=black](http://kylebing.cn/tools/clock-a?theme=black)

- 白色指针尖 [http://kylebing.cn/tools/clock-a?theme=white&type=pointer](http://kylebing.cn/tools/clock-a?theme=white&type=pointer)

- 白色指针尖罗马数字 [http://kylebing.cn/tools/clock-a?theme=white&type=pointer&number=lm](http://kylebing.cn/tools/clock-a?theme=white&type=pointer&number=lm)

- 白色放大实时秒数 [http://kylebing.cn/tools/clock-a?zoomsecond=1](http://kylebing.cn/tools/clock-a?zoomsecond=1)

- 白色第二种表盘 [http://kylebing.cn/tools/clock-a?set=1](http://kylebing.cn/tools/clock-a?set=1)

> CSDN 教程: [https://blog.csdn.net/KimBing/article/details/141223741](https://blog.csdn.net/KimBing/article/details/141223741)