JavaScript图形实例:SierPinski三角形
1.SierPinski三角形
Sierpinski三角形是一种分形,由波兰数学家谢尔宾斯基在1915年提出,它是一种典型的自相似集。其生成过程为:
(1)取一个三角形(多数使用等边三角形);
(2)沿三边中点连线,将它分成四个小三角形;
(3)对上、左、右这三个小三角形重复这一过程。
SierPinski三角形的生成示意如图1所示。
图1 SierPinski三角形的生成
SierPinski三角形采用递归过程易于实现,编写如下的HTML代码。
在浏览器中打开包含这段HTML代码的html文件,可以看到在浏览器窗口中绘制出的SierPinski三角形,如图2所示。
图2 递归深度depth =5的SierPinski三角形
2.SierPinski垫片
SierPinski垫片的生成过程为:
(1)取一个实心的三角形(多数使用等边三角形);
(2)沿三边中点连线,将它分成四个小三角形,
(3)去掉中间的那一个小三角形;
(4)对其余三个小三角形重复这一过程。
SierPinski垫片的生成示意如图3所示。
图3 SierPinski垫片的生成
SierPinski垫片采用递归过程易于实现,编写如下的HTML代码。
在浏览器中打开包含这段HTML代码的html文件,可以看到在浏览器窗口中绘制出的SierPinski垫片,如图4所示。
图4 递归深度depth =5的SierPinski垫片
3.SierPinski地毯
SierPinski垫片的初始图形是三角形,如果将初始图形改成正方形,便可以得到称为SierPinski地毯的图形。它的生成过程为:
(1)取一个实心的正方形;
(2)将正方形的每边三等分,并连接相应的等分点,从而将原正方形等分为面积相等的9个小正方形;
(3)去掉中间的那一个小正方形;
(4)对其余的8个小正方形重复这一过程。
SierPinski垫片的生成示意如图5所示。
图5 SierPinski地毯的生成
设正方形的左上角坐标为(x,y),边长为L,则中间正方形的左上角坐标和边长分别为(x+L/3,y+L/3)和L/3,其余8个小正方形的边长均为L/3,左上角坐标分别为(x,y)、(x+L/3,y)、(x+2*L/3,y)、(x,y+L/3)、(x+2*L/3,y+L/3)、(x,y+2*L/3)、(x+L/3,y+2*L/3)和(x+2*L/3,y+2*L/3)。
为了绘制SierPinski地毯,可以编写如下的HTML代码。
在浏览器中打开包含这段HTML代码的html文件,可以看到在浏览器窗口中绘制出SierPinski垫片,如图6所示。
图6 递归深度depth =5的SierPinski地毯