标签: HTML5

生命游戏模拟器

生命游戏(Game of Life),或者叫它的全称John Conway's Game of Life。是英国数学家约翰·康威在1970年代所发明的一种元胞自动机。
所谓元胞自动机其实是一种离散的状态机,即无数个独立的格子,每个格子处于某种状态,然后所有格子按照预先设定好的规律进行状态演化。格子们可以是任意维度、任意形状、按任意规律排布的。
而生命游戏就是最简单的元胞自动机之一——在二维平面上的方格子(细胞),每个细胞有两种状态:死或活,而下一回合的状态完全受它周围8个细胞的状态而定。按照以下三条规则进行演化:
1. 活细胞周围的细胞数如果小于2个或多于3个则会死亡;(离群或过度竞争导致死亡)
2. 活细胞周围如果有2或3个细胞可以继续存活;(正常生存)
3. 死细胞(空格)周围如果恰好有3个细胞则会诞生新的活细胞。(繁殖)
这三条规则简称B3/S23。如果调整规则对应的细胞数量,还能衍生出其他类型的自动机。

以上是对生命游戏这个概念的解释,而我2013年时为它编写了一个js版的模拟器,作为个人项目练习之用。具体解释和功能介绍详见知乎专栏:个人项目开发示例:生命游戏

这里只是为了放个地址方便访问。

点击打开模拟器

素数螺旋

本文启发自知乎问题:极坐标表示 5000 到 50000 之间的素数画点到纸上为什么会形成一条斐波那契螺旋线?

把一个自然数n用极坐标表示,也就是在坐标(n*cos n,n*sin n)的位置绘制一个点;而当你把所有素数绘制到纸上之后,会发现它是一个包含了许多条空白线条的圆形:

很显然,空白是合数导致的,但为什么合数会排列成一条条曲线呢?

王小龙已经做了精彩的回答。不过为了更直观地理解,我写了这个小程序:

[阅读全文]

WWDC 2014海报的彩虹特效

这个有趣的小程序出自知乎问题:WWDC 2014 的海报是怎么做出来的?

本程序使用HTML5+JS进行开发,可以将任意图片转换成WWDC2014海报的样式:用色调如彩虹般绚丽的圆角矩形来拼成原图。

里面已经预置了几个图形,只要点最上面的按钮即可切换;当然,最有意思的是在右边上传本地硬盘的图片,不管是什么图,都能转换成海报上的效果。
(上传图片需较新版本的IE、FF、Chrome浏览器才能支持,建议使用浅色背景、深色图案的)

Enjoy it.

[阅读全文]

约瑟夫斯问题:最后生还者

有这么一个古老的问题:一群死刑犯排成圆圈,每隔一人枪毙一个,转完一圈后从头开始继续枪毙,直到剩下最后一个人,这个幸运儿会被释放。

问:一开始站在哪个位置才能活下来?

这就是著名的约瑟夫斯问题,排成的圆圈叫做约瑟夫斯环。

(当然,隔一人只是个特殊情况,约瑟夫斯问题包含了间隔任何人数的计算方法)

在上面维基百科的链接以及知乎的答案里已经有了通用的计算方法,这里就不必讲什么公式和证明了,而是直接用图形来演示:

[阅读全文]