自己做了一个随机转盘,后来又加了几个小工具

最开始做 WheelPage 的时候,我只想做一个随机转盘。输入几个选项,按一下开始,等转盘停下来给出结果。功能不算复杂,也没有什么特别的想法,就是希望打开网页以后能直接使用。

做起来才发现,转盘能转只是第一步。选项数量变了,扇区和文字得跟着调整;手机屏幕小,输入选项和操作按钮也得考虑;转盘停下来以后,还要让人看清楚选中了什么。这些地方单独看都不是什么大问题,但放在一起就需要花时间处理。

现在这个页面就是在线随机转盘。可以添加自己的选项,用来抽签、随机点名,或者从几个备选方案里挑出一个。

说到随机点名,其实 WPS 表格也能做。比如在 A2 到 A11 填好一份没有空行的名单,在单元格中输入:

=INDEX(A2:A11,RANDBETWEEN(1,ROWS(A2:A11)))

就能从名单中随机抽取一个名字。表格适合保存名单、整理数据,也方便后续统计。网页转盘则更适合需要现场展示抽取过程的情况,两种方法各有用途。

转盘做完以后,我又增加了几个用途接近的小工具。

只有两个选项时,其实没必要使用转盘,所以做了一个在线抛硬币。点击以后得到正面或反面,页面也会记录抛出的次数和结果。没什么复杂的操作,就是需要二选一的时候可以直接用。

在线骰子花的时间多一些。我想做的是能滚动、碰撞、停下来的 3D 骰子,而不只是生成一个随机数字。现在用 Three.js 和 Cannon-ES 实现了几种不同的多面体骰子,包括 D4、D6、D8、D10、D12 和 D20。期间处理过骰子停下后姿态不对的问题,物理模拟的结果和屏幕上看到的效果,有时候还真不是一回事。

还有一个石头剪刀布,就是大家熟悉的规则。选石头、剪刀或者布,和电脑玩一局。这个没有做太多复杂的东西,能选、能判断胜负、能继续下一局就够了。

除了这些带有随机玩法的工具,我还做了随机数生成器和在线计数器。

随机数生成器可以设置数字范围,生成整数或小数,也可以一次生成多个数字。平时需要抽取编号、准备一些测试数据的时候能用上。

计数器则是另一回事,它不负责随机结果,就是用来记录数量。可以添加多个计数项目、设置步长、查看历史记录。如果需要记录几组数据、整理表格或者计算汇总,WPS 显然更方便;如果只想临时统计几个数字,打开计数器按几下也能解决。

这些页面现在放在同一个网站里,名字叫 WheelPage。

目前主要就是这六个工具。我没有给它们增加注册流程,打开页面就能使用。最近也在继续处理手机适配、动画效果和一些操作细节。

做这种小网站,很多工作其实不在功能名称里。转盘转起来以后能不能停得自然,骰子停下来时有没有站稳,手机上点按钮会不会误触,结果记录能不能保存,这些都需要自己打开页面试。

项目还在维护,也有一些地方没有处理好。

如果大家平时有用 WPS 做随机点名、抽签或者计数的经验,也欢迎交流一下。我也想看看,还有哪些场景适合做成简单的网页工具。

江西省
浏览 108
收藏
6
分享
6 +1
+1
全部评论