JavaScript图形实例：平面镶嵌图案
用形状、大小完全相同的一种或几种平面图形进行拼接，彼此之间不留空隙、不重叠地铺成一片，就叫做这几种图形的平面镶嵌。
1．用一种多边形实现的平面镶嵌图案
我们可以采用正三角形、正方形或正六边形实现平面镶嵌。
（1）用正方形平铺。
用正方形进行平面镶嵌比较简单，编写如下的HTML代码。
在浏览器中打开包含这段HTML代码的html文件，可以看到在浏览器窗口中绘制出如图1所示的正方形平面镶嵌图案。
图1 正方形平面镶嵌图案（一）
将上述程序中的语句： x0=0; 改写为：
if (k%2==0) x0=0;
else x0=-L/2;
并将填充颜色改为单色填充，例如，ctx.fillStyle = "green";，则绘制出如图2所示的正方形平面镶嵌图案。
图2 正方形平面镶嵌图案（二）
（2）用正三角形平铺。
用正三角形进行平面镶嵌，编写如下的HTML代码。
在浏览器中打开包含这段HTML代码的html文件，可以看到在浏览器窗口中绘制出如图3所示的正三角形平面镶嵌图案。
图3 正三角形平面镶嵌图案
（3）用正六边形平铺。
用正六边形进行平面镶嵌，编写如下的HTML代码。
在浏览器中打开包含这段HTML代码的html文件，可以看到在浏览器窗口中绘制出如图4所示的正六边形平面镶嵌图案。
图4 正六边形平面镶嵌图案
2．用几种多边形实现的平面镶嵌图案
还可以用一种以上的多边形来实现的平面镶嵌。
（1）正三角形和正方形组合平面镶嵌。
可以使用正三角形与正方形，通过组合后重复排列的方式完成镶嵌。编写如下的HTML代码。
在浏览器中打开包含这段HTML代码的html文件，可以看到在浏览器窗口中绘制出如图5所示的正三角形和正方形组合平面镶嵌图案。
图5 正三角形和正方形组合平面镶嵌图案
（2）正六边形与正三角形组合平面镶嵌。
可以使用正六边形与正三角形，通过组合后重复排列的方式完成镶嵌。编写如下的HTML代码。
在浏览器中打开包含这段HTML代码的html文件，可以看到在浏览器窗口中绘制出如图6所示的正六边形与正三角形组合平面镶嵌图案。
图6 正六边形与正三角形组合平面镶嵌图案
（3）正八边形组合正方形平面镶嵌。
可以使用正八边形与正方形，通过组合后重复排列的方式完成镶嵌。编写如下的HTML代码。
在浏览器中打开包含这段HTML代码的html文件，可以看到在浏览器窗口中绘制出如图7所示的正八边形组合正方形平面镶嵌图案。
图7 正八边形组合正方形平面镶嵌图案
