【WebGL】《WebGL编程指南》读书笔记——第4章
一、前言
今天继续第四章的学习内容,开始学习复合变换的知识。
二、正文
Example1: 复合变换
在书中,作者为我们封装了一套用于变换的矩阵对象:Matrix4对象。它包含以下几种方法:
- Matrix4.setIdentity(): 将Matrix4实例化为单位矩阵
- Matrix4.setTranslate(x,y,z): 将Matrix4实例设置为平移变换矩阵,在x轴平移距离为x,在y轴平移距离为y,在z轴平移距离为z;
- Matrix4.setScale(x,y,z): 将Matrix4实例设置为缩放变换矩阵,缩放因子分别为x,y,z;
- Matrix4.setRotate(angle,x,y,z): 将Matrix4实例设置为旋转变换矩阵,角度为angle,旋转轴为(x,y,z);
- Matrix4.translate(x,y,z): 将Matrix4实例本身乘以一个平移变换矩阵;
- Matrix4.rototate(angle,x,y,z): 将Matrix4实例本身乘以一个旋转变换矩阵;
- Matrix4.scale(x,y,z): 将Matrix4实例本身乘以一个缩放变换矩阵;
- Matrix4.set(m): 将Matrix4设置为m;
- Matrix4.elements: 类型化数组包含了Matrix4实例的矩阵元素;
var modelMatrix = new Matrix4();
modelMatrix.setRotate(ANGLE,,,);
modelMatrix.translate(Tx,,); ... ... gl.uniformMatrix4fv(u_ModelMatrix,false,modelMatrix.elements);
Example2: 动画
requestAnimationFrame(func): 请求浏览器在将来某时刻回调函数func以完成重绘。我们应当在回调函数最后再次发起该请求。
var tick = function() {
currentAngle = animate(currentAngle); // Update the rotation angle
draw(gl, n, currentAngle, modelMatrix, u_ModelMatrix); // Draw the triangle
requestAnimationFrame(tick, canvas); // Request that the browser calls tick
};
tick();
由于浏览器执行Tick()的时间是不可控的,我们需要让三角形匀速的旋转,那么就需要控制时间:
var g_last = Date.now();
function animate(angle) {
// Calculate the elapsed time
var now = Date.now();
var elapsed = now - g_last;
g_last = now;
// Update the current rotation angle (adjusted by the elapsed time)
var newAngle = angle + ANGLE_STEP * (elapsed / 1000.0);
return newAngle %= ;
}
三、结尾
下周日继续更新第五章。
【WebGL】《WebGL编程指南》读书笔记——第4章的更多相关文章
- Android权威编程指南读书笔记(1-2章)
第一章 Android应用初体验 1.4用户界面设计 <?xml version="1.0" encoding="utf-8"?> ADT21开发版 ...
- hive编程指南——读书笔记(无知拾遗)
set hive.metastore.warehouse.dir=/user/myname/hive/warehouse; 用户设定自己的数据仓库目录.不影响其他用户.也在$HOME/.hiverc中 ...
- Hive编程指南读书笔记(1):
1.Mapreduce是一种计算模型,将计算任务分割成多个可以在服务器集群中并行执行的任务,然后分散到一群家用的或者服务器级别的硬件机器上,从而降低成本并提供水平可伸缩性. 2.mapreduce的两 ...
- <<Hive编程指南>>读书笔记
1. 设置hive以本地模式运行(即使当前用户是在分布式模式或伪分布式模式下执行也使用这种模式) set hive.exec.model.local.auto=true; 若想默认使用这个配置,可以将 ...
- 《python核心编程》读书笔记--第16章 网络编程
在进行网络编程之前,先对网络以及互联网协议做一个了解. 推荐阮一峰的博客:(感谢) http://www.ruanyifeng.com/blog/2012/05/internet_protocol_s ...
- 《Linux多线程服务器端编程》读书笔记第3章
<Linux多线程服务器端编程>第3章主要讲的是多线程服务器的适用场合与常用的编程模型. 1.进程和线程 一个进程是"内存中正在运行的程序“.每个进程都有自己独立的地址空间(ad ...
- css权威指南读书笔记-第10章浮动和定位
这一章看了之后真是豁然开朗,之前虽然写了圣杯布局和双飞翼布局,有些地方也是模糊的,现在打算总结之后再写一遍. 以下都是从<css权威指南>中摘抄的我认为很有用的说明. 浮动元素 一个元素浮 ...
- 《python核心编程》读书笔记--第18章 多线程编程
18.1引言 在多线程(multithreaded,MT)出现之前,电脑程序的运行由一个执行序列组成.多线程对某些任务来说是最理想的.这些任务有以下特点:它们本质上就是异步的,需要多个并发事务,各个事 ...
- JavaScript权威指南读书笔记【第一章】
第一章 JavaScript概述 前端三大技能: HTML: 描述网页内容 CSS: 描述网页样式 JavaScript: 描述网页行为 特点:动态.弱类型.适合面向对象和函数式编程的风格 语法源自J ...
- 《Unix环境高级编程》读书笔记 第13章-守护进程
1. 引言 守护进程是生存期长的一种进程.它们常常在系统引导装入时启动,仅在系统关闭时才终止.它们没有控制终端,在后台运行. 本章说明守护进程结构.如何编写守护进程程序.守护进程如何报告出错情况. 2 ...
随机推荐
- shell自动化巡检
#!/bin/bash#主机信息每日巡检 IPADDR=$(ifconfig eth0|grep 'inet addr'|awk -F '[ :]' '{print $13}')#环境变量PATH没设 ...
- MongoDB优化与一些需要注意的细节
这里总结下这段时间使用mongo的心得,列出了几个需要注意的地方. 1. 系统参数及mongo参数设置 mongo参数主要是storageEngine和directoryperdb,这两个参数一开始不 ...
- Jackson将json string转为Object,org.json读取json数组
从json文件读取json string或者自定义json string,将其转为object.下面采用的object为map,根据map读取json的某个数据,可以读取第一级的数据name,后来发现 ...
- 天梯赛 L2-019. 悄悄关注 map
L2-019. 悄悄关注 时间限制 150 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 陈越 新浪微博上有个"悄悄关注",一个用 ...
- 为并发而生的 ConcurrentHashMap(Java 8)
HashMap 是我们日常最常见的一种容器,它以键值对的形式完成对数据的存储,但众所周知,它在高并发的情境下是不安全的.尤其是在 jdk 1.8 之前,rehash 的过程中采用头插法转移结点,高并发 ...
- UWP 共享文件——接收者
UWP上共享,分为接收者(别人共享数据给你,你接收了,然后在做你的处理)和发送者(你给别人发送数据,就像你的App支持图片共享到微信好友或者朋友圈那样,虽然UWP上的微信并不支持这样子) 很简单(参考 ...
- 【tyvj P4868】天天和不可描述
http://www.tyvj.cn/p/4868 超级水的题,用递归来模拟,用链表保存这层的内容,每遇到一个左括号就递归一层并合并返回的链表,遇到右括号后返回. 递归进入下一层时传递个参数标记读取新 ...
- java基础解析系列(十一)---equals、==和hashcode方法
java基础解析系列(十一)---equals.==和hashcode方法 目录 java基础解析系列(一)---String.StringBuffer.StringBuilder java基础解析系 ...
- zeppelin0.7.3源码编译
操作系统: Centos7.X Python版本: Python2.7 Maven版本:3.1.* Git:1.8.3.* JAVA:java1.7+ node npm bower grunt 每次执 ...
- beautifulSoup模块
这个库用来对网页进行解析功能,十分强大,有了它我们可以减少对正则的使用,也能顺利的从网页源码中拿到我们要的值.他是一个灵活,方便的网页解析库,处理高效,支持多种解析器. 这个库把HTML源码解析成对象 ...