H5如何在网页中绘制三角形
H5是目前比较火的编程工具之一,功能十分强大,深受编程人员的喜爱。对于初学者来说,利用H5绘制图形是必须经历的学习阶段。例:如用H5绘制一个三角形。具体方法如下:
操作方法
- 01
首先,我们得在网页主体<body>标签里,定义一张画布,可以随便定义画布的大小,和背景颜色等,如图1
- 02
在<head>头部输入JS代码,通过windows方法加载到网页中去,并定义一只“2D”画笔,代码如图2
- 03
运行程序,大家可以看到,该我们定义的画布大小,颜色等,如图3
- 04
在画布起始点(50,50)定义一个起始点(即从X轴、Y轴什么地方开始做图),代码如图4
- 05
从起始点(50,50)到X轴(100)、y轴(200)画一条斜线,代码如图5
- 06
通过storke输出语句在网页中输出程序,这时个我们就可以在网页中看到一条斜线:如图6
- 07
在Y 轴上找一条长100PX直线,Y轴的长度保持不变(200),x 轴变为200PX,代码如图7
- 08
运行程序,结果如图8
- 09
通过closePath合并三角形的路径,代码如图9
- 10
运行程序,这时个一个完整的三角形就做成了,结果如图10
赞 (0)