![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
webgl
文章平均质量分 94
webgl的学习
yanling.zhang
这个作者很懒,什么都没留下…
展开
-
webgl - 矩阵变换
变换有3种状态: 1.平移 2.旋转 3.缩放例如:1.已知:顶点p(x, y, z)在x,y ,z三个方向上,分别将点p移动tx,ty,tz求:点p移动后的位置p’(x’,y’,z’)解:如果这个图形中并非只有一个顶点,而是有3个,或者更多,那么所有的顶点也是按照同样原理进行平移。因此:点p 的移动结果 p’ 就可以这么写:由上可知,在GLSL ES 语言里,是可以直接进行向量运算。下面的顶点着色器里的代码:a_Position 是原始点位,属于attribute 变原创 2022-06-18 19:24:22 · 192 阅读 · 0 评论 -
webgl - 读书笔记
一. 认识webgl课前准备安装webstorm 或vscode 开发工具。安装live-server,用于启服务,安装方法 npm i -g live-server需掌握es6、html、css 的基础知识。数学基础,三角函数和向量(非必须)。课堂目标对webgl 的概念有一个整体认知掌握webgl 基本绘图原理和流程知识点webgl 概述webgl 最短教程 - 在画布上刷底色webgl 最简单图形 - 画一个点第一章 webgl概述1-webgl是什么?web原创 2021-11-03 15:39:02 · 791 阅读 · 0 评论 -
webgl - 3- 绘制三角形(上)
三角形是一个最简单,稳定的面,webgl中的三维模型都是由三角形面组成的。本章节目标:1.理解多点绘图原理2.可以绘制三角形,并将其组合成多边形。知识点:换缓冲区对象点,线,面图像第一章webgl的绘图方式先看下webgl是怎么绘图的:1.绘制多点:如果是线,就连接点成线如果是面,那就在图形内部,逐便元填色webgl绘图的方式就是这么简单,接下来就说一下这个绘图方式在程序中是如何实现的。第2章:绘制多点:在webgl 里所有的图形都是由顶点连接而成的,咱们就先画原创 2022-05-29 20:24:29 · 630 阅读 · 0 评论 -
webgl - 2 - js与着色器间的数据传输
er原创 2021-11-18 16:08:40 · 366 阅读 · 0 评论