WebGL常用数学公式

1.三角函数

坐标轴采用右手法则,沿Z轴的逆时针方向为正角度,假设原始点为p(x,y,z),a是X轴旋转到点p的角度,r是从原始点到p点的距离。用这两个变量计算出点p的坐标,等式如下:

x = rcos a;
y = rsin a;

类似的可以使用r,a,b(p旋转的角度)来表示p‘的坐标:

x‘ = r cos(a + b);
y‘ = r sin(a + b);

利用三角函数两角和公式:

sin(a +/- b) = sin a cos b +/- cos a sin b
cos(a +/- b) = cos a cos b -/+ sin a sin b

可得:

x‘ = r(cos a cos b - sin a sin b)
y‘ = r(sin a cos b + cos a sin b)

最后将x,y等式带入,消除r 和 a 可得等式:

x‘ = x cos b - y sin b
y‘ = x sin b + y cos b
z‘ = z

另外计算中也会用到弧度计算功能:

radian = a * (PI / 180)

2.变换矩阵:旋转

矩阵和矢量的方式可以用如下等式表示:

等式的右边由x、y、z组成的矢量被称为三维矢量。计算方式如下:

x‘ = ax + by + cz
y‘ = dx + ey + fz
z‘ = gx + hy + iz

在看看三角函数的等式,并与其比较:

x‘ = ax + by + cz
x‘ = x cosb - y sinb

如果 a = cosb, b = -sinb,c = 0,那么两个等式完全相同。在看y‘:

y‘ = dx + ey + fz
y‘ = x sinb + y cosb

如果 d = sinb, e = cobb, f = 0,那么两个等式完全相同。将这些结果代入到等式3.4中,得到等式:

这个矩阵被称为变换矩阵(transformation matrix),也被称为旋转矩阵(rotation matrix)。

3.变换矩阵:平移

平移公式:x‘ = x + Tx。

如下所示是4*4矩阵:

该矩阵的乘法结果如下所示:

根据最后一个式子 1 = mx + ny + oz + p,很容易求得系数m = 0, n = 0, o = 0, p = 1;比较x‘,可知 a = 1, b = 0, c = 0, d = Tx;类似地,比较y‘,可知e = 0, f = 1,g = 0, h = Ty;比较z‘,可知i = 0, j = 0, k = 1, l = Tz。这样,就可以写出表示平移的矩阵,又称为平移矩阵(translation matrix)。如下所示:

4. 4*4的旋转矩阵

将旋转矩阵从一个3*3矩阵转变为一个4*4矩阵,只需要将旋转公式和4*4矩阵公式比较下:

x‘ = xcosb - ysinb
y‘ = xsinb + ycosb
z‘ = z
x‘ = ax + by + cz + d
y‘ = ex + fy + gz + h
z‘ = ix + jy + kz + l
l = mx + ny + oz + p

例如,当你通过比较x‘ = xcosb - ysinb与x‘ = ax + by +cz +d时,可知a = cosb, b = -sinb, c= 0, d = 0。以此类推,求得y‘和z‘等式中的系数,最终得到4*4的旋转矩阵。如下所示:

5.变换矩阵:缩放

假设在三个方向X轴,Y轴,Z轴的缩放因子Sx, Sy, Sz不相关,那么有:

x‘ = Sx * x
y‘ = Sy * y
z‘ = Sz * z

和矩阵的乘法结果比较,可知缩放操作的变换矩阵:

时间: 2024-11-03 05:24:30

WebGL常用数学公式的相关文章

常用数学公式

逐步更新: 皮克公式: 给定顶点坐标均是整点(或正方形格点)的简单多边形,皮克定理说明了其面积S和内部格点数目n.边上格点数目s的关系: (其中n表示多边形内部的点数,s表示多边形边界上的点数,S表示多边形的面积)

ACM 常用几何基本数学公式

ACM常用几何基本数学公式 1.   海伦公式求面积 公式描述:公式中a,b,c分别为三角形三边长,p为半周长,S为三角形的面积. 2.   矢量向量求面积 3.   点到直线的距离公式 方法一:距离公式直接求 公式描述:公式中的直线方程为Ax+By+C=0,点P的坐标为(x0,y0).但是直线方程不是够直接.推荐使用方法二. 方法二:先用海伦公式求面积然后求三角形高 4.   点到线段的距离公式[或:点到线段最近的点] 有以下四种情况: 点在线段上,距离为0: 线段是一个点,用两点公式求: 三

iOS开发中常用的数学函数

/*---- 常用数学公式 ----*/ //指数运算 3^2 3^3 NSLog(@"结果 %.f", pow(3,2)); //result 9 NSLog(@"结果 %.f", pow(3,3)); //result 27 //开平方运算 NSLog(@"结果 %.f", sqrt(16)); //result 4 NSLog(@"结果 %.f", sqrt(81)); //result 9 //进一 NSLog(@&q

AS3动画效果常用公式

缓动公式: sprite.x += (targetX – sprite.x) * easing;//easing为缓动系数变量 sprite.y += (targetY – sprite.y) * easing; 弹性公式: vx += (targetX – sprite.x) * spring;//spring为弹性系数 vy += (targetY – sprite.y) * spring; sprite.x += (vx *= friction);//friction为摩擦力 sprite

几何画板中该如何插入公式

在使用几何画板制作课件的过程中,可能会经常使用到某些数学公式或符号,那么该如何将数学公式插入到几何画板呢?下面给大家介绍两种方法,都是非常实用的,希望对大家学习几何画板有帮助. 方法一 导入法 像导入外部图片一样,将Word或WPS中的数学公式或符号,导入到几何画板的课件中.  可以先在Word或WPS中将数学公式编辑好,然后执行复制命令,在几何画板中粘贴即可将公式作为图片导入.  从Word中导入公式示例 方法二 “编辑数学格式文本”法 其实几何画板中提供了输入常用数学公式或符号命令,只是初学

使用css3画饼图

CSS3 Gradient介绍参考地址: http://www.cnblogs.com/lhb25/archive/2013/01/30/css3-linear-gradient.html http://www.zhangxinxu.com/wordpress/?p=3639 效果图: html: <div class="colorWheel"> <div class="piece"></div> </div> css

as3 公式

AS3缓动公式:sprite.x += (targetX - sprite.x) * easing;//easing为缓动系数变量sprite.y += (targetY - sprite.y) * easing;AS3弹性公式:vx += (targetX - sprite.x) * spring;//spring为弹性系数vy += (targetY - sprite.y) * spring;sprite.x += (vx *= friction);//friction为摩擦力sprite.

Noip前的大抱佛脚----数论

数论 知识点 Exgcd \(O(logn)\)求解\(Ax+By=C\)的问题 1.若\(C\%gcd(A,B)!=0\)则无解 2.\(Gcd=gcd(A,B);A/=Gcd,B/=Gcd,C/=Gcd\) 3.代入下面代码求\(Ax+By=1\) 4.\(x*C\),得到一组特解 5.通解为\(\begin{cases}x=x_0+k*B \\y=y_0+k*A\end{cases}\) void Exgcd(ll a,ll b,ll &x,ll &y) { if(!b){x=1;y

公式编辑器快捷键

作为一个理工科专业的学生,在做题和撰写论文中在所难免应用一些数学公式或符号.一般自带的编辑器在遇到公式较多时,没法快速找出对应的符号或者模板,特别是公式中符号较为特殊时,要找到对应符号需要翻查很长时间,更增加了输入的繁琐.下面小编给大家推荐一款比较强大的亿图公式编辑器(EdrawMath),轻松地帮你编辑带公式的文档. EdrawMath是一款好用的在线公式编辑器,是理科生备选的工具.不仅因为它强大的实用性,而且有市面上其他公式编辑器难以替代的强大功能.今天跟大家聊一聊选择EdrawMath数学