绘图详解(二)

一、简单图形五角星的制作

我们生活中常见的五角星如下图所示


<canvas>绘图详解(二)_第1张图片
image.png

只要知道十个点如何表示,画三角形也就简单多了,不难发现,这十个点处于半径不同的两个同心圆中,各个点的坐标可以表示为下图所示

<canvas>绘图详解(二)_第2张图片
image.png

代码如下:




    
    画五角星
    


    该浏览器不支持canvas
    


显示效果如下:


<canvas>绘图详解(二)_第3张图片
image.png

这样,一个五角星就完成了。

你可能感兴趣的:(绘图详解(二))