咋一提到分形艺术，可能觉得这词儿挺咋呼，分形就分形吧，还说什么艺术，话说回来，啥叫分形呢？

首先我们先看一个效果：

看完上面的图形，相信对于什么时候分形大家心里应该有个了底，上面展示了从一个等边三角形开始每一次将每条边四等份，中间部分是对折等分的，重复此过程一定次数，最终就会得出一朵漂亮的雪花。

分形的过程我们已经大致了解了，那么我们如何用js来画出雪花呢？

其实从上图中我们可以看出绘制雪花其实不难，难点在于数学计算。

首先我们看一下单边的等分：

高维度的koch曲线最终都可以分解为上图所示的线，其中的4条线段长度都相等均为原始边长的1/3，中间所组成的三角形均为等边三角形。

在绘制时，我们只需要知道x1和x2的坐标，就可以相应的算出x3，x4，x5的坐标，我们只需要将这些点依次连接，最终就可以画出整个图形。

那么在知道x1和x2的情况下，x3，x4，x5的坐标分别等于多少呢？

var x3 = (x2 - x1) / 3 + x1;
var y3 = (y2 - y1) / 3 + y1;
var x4 = (x2 - x1) / 3 * 2 + x1;
var y4 = (y2 - y1) / 3 * 2 + y1;
var x5 = x3 + ((x2 - x1) - (y2 - y1) * Math.sqrt(3)) / 6;
var y5 = y3 + ((x2 - x1) * Math.sqrt(3) + (y2 - y1))  / 6;

对于x3，x4的计算相信应该没什么太大的问题，那么x5的计算时怎么得来的呢？

从图中我们可以看出x3，x4，x5组成了一个等边三角形，那么x5我们就可以看成是x4以x3为中心逆时针旋转60度得到的。

既然涉及到了坐标旋转，我们直接将坐标旋转公式搬过来（推导过程自行百度）

var x0= (x - rx0)*cos(a) - (y - ry0)*sin(a) + rx0 ;
var y0= (x - rx0)*sin(a) + (y - ry0)*cos(a) + ry0 ;

其中（rx0，ry0）是旋转中心，（x，y）待旋转点，（x0，y0）旋转后的新坐标。

将上面计算的x3，x4的坐标带入旋转公式坐标旋转公式换算一下就可以计算出x5的坐标了。

最后附上在最终效果，猛戳这里查看