![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
webgl
L-freeMan
从心出发
展开
-
webgl用法(第二章)
点击画布绘制点上例只是实现了一个静态点的绘制,但真正的 WebGL 应用是需要通过网页和用户进行交互,从而改变画面。实现一个简单交互程序:在画布上,鼠标点击的位置上绘制一个点,且这个点的颜色是随机的。要求:通过 JavaScript 往着色器程序中传入顶点位置和颜色数据,从而绘制点的位置和颜色。着色器程序1、顶点着色器<!-- 顶点着色器 --><script type="shader-source" id="vertexShader"> // 浮点数设置为中等精度原创 2021-08-26 18:32:37 · 378 阅读 · 0 评论 -
webgl用法和简介
WebGL 的基本图元包括:点、线段、三角形。三角形图元分类基本三角形(TRIANGLES)基本三角形是一个个独立的三角形。假如:提供给着色器 6 个顶点,WebGL 会绘制 2 个三角形,前三个顶点绘制一个,后三个顶点绘制另一个,互不相干。例如:[v1, v2, v3, v4, v5, v6] 采用基本三角形图元进行绘制,绘制完如下图所示[v1, v2, v3] 为一个三角形、[v4, v5, v6] 为另一个三角形。绘制三角形的数量 = 顶点数 / 3三角带(TRIANGLE_STR原创 2021-08-26 18:23:47 · 8676 阅读 · 0 评论