diff --git a/05/README-ch.md b/05/README-ch.md index dd4f536..ec48c9b 100644 --- a/05/README-ch.md +++ b/05/README-ch.md @@ -1,33 +1,33 @@ # 算法绘画 ## 造型函数 -这一章应该叫做 Mr. Miyagi 的栅栏课。之前我们给规范化的 x,y 坐标和红、绿通道建立了映射(map)。本质上说我们是建造了这样一个函数:输入一个二维向量(x,y),然后返回一个四维向量(r,g,b,a)。但在我们跨维度转换数据之前,我们先从更加…更加简单的开始。我们来建一个只有一维变量的函数。你花越多的时间和精力在这上面,你的 shader 功夫就越厉害。 +这一章应该叫做宫城先生的粉刷课(来自电影龙威小子的经典桥段)。之前我们把规范化后的 x,y 坐标映射(map)到了红色和绿色通道。本质上说我们是建造了这样一个函数:输入一个二维向量(x,y),然后返回一个四维向量(r,g,b,a)。但在我们跨维度转换数据之前,我们先从更加…更加简单的开始。我们来建一个只有一维变量的函数。你花越多的时间和精力在这上面,你的 shader 功夫就越厉害。 ![The Karate Kid (1984)](mr_miyagi.jpg) -接下来的代码构造就是我们的「栅栏」。在它之中我们把规范化的 x 坐标(```st.x```)可视化。有两种途径:一种是用亮度(度量从黑色到白色的渐变过程),另一种是在顶部绘制一条绿色的线(在这种情况下 x 被直接赋值给 y)。不用过分在意绘制函数,我们马上会更加详细地解释它。 +接下来的代码结构就是我们的基本功。在它之中我们对规范化的 x 坐标(```st.x```)进行可视化。有两种途径:一种是用亮度(度量从黑色到白色的渐变过程),另一种是在顶层绘制一条绿色的线(在这种情况下 x 被直接赋值给 y)。不用过分在意绘制函数,我们马上会更加详细地解释它。
**简注** :```vec3``` 类型构造器“明白”你想要把颜色的三个通道赋值到一个值里,就像 ```vec4``` 明白你想要构建一个四维向量,三维向量加上第四个值(比如颜色的三个值加上透明度)。请参照上面示例的第 20 到 26 行。 -这些代码就是你的栅栏;遵守和理解它非常重要。你将会一遍又一遍地回到 0.0 到 1.0 这个区间。你将会掌握融合与构建这些代码的艺术。 +这些代码就是你的基本功;遵守和理解它非常重要。你将会一遍又一遍地回到 0.0 到 1.0 这个区间。你将会掌握融合与构建这些代码的艺术。 -这些 x 与 y(或亮度)之间一对一的关系称作**线性插值**(linear interpolation)。现在起我们可以用一些数学函数来改造这些代码行。比如说我们可以把 x 升到 5 来做一个曲线。 +这些 x 与 y(或亮度)之间一对一的关系称作**线性插值**(linear interpolation)。(译者注:插值是离散函数逼近的重要方法,利用它可通过函数在有限个点处的取值状况,估算出函数在其他点处的近似值。因为对机器运算来说,屏幕像素注定是离散的而不是连续的,计算机图形学常用插值来填充图像变换时像素之间的空隙。)现在起我们可以用一些数学函数来改造这些代码行。比如说我们可以把 x 升到 5 来做一个曲线。
很有趣,对吧?试试看把第 19 行的指数改为不同的值,比如:20.0,2.0,1.0,0.0,0.2 或 0.02。理解值和指数之间的关系非常重要。这些数学函数可以让你灵动地控制你的代码,就像是给数据做针灸一样。 -[```pow()```](../glossary/?search=pow) 是 GLSL 的一个原生/内建函数,GLSL 有很多原生函数。大多数原生函数都是硬件加速的,也就是说如果你正确使用这些函数,你的代码就会跑得更快。 +[```pow()```](../glossary/?search=pow) (求x的y次幂)是 GLSL 的一个原生函数,GLSL 有很多原生函数。大多数原生函数都是硬件加速的,也就是说如果你正确使用这些函数,你的代码就会跑得更快。 -换掉第 19 行的幂函数,试试看[```exp()```](../glossary/?search=exp),[```log()```](../glossary/?search=log) 和 [```sqrt()```](../glossary/?search=sqrt)。当你用 Pi 来玩的时候有些方程会变得更有趣。在第 5 行我定义了一个宏,使得每当程序调用 ```PI``` 的时候就用 ```3.14159265359``` 来替换它。 +换掉第 19 行的幂函数,试试看[```exp()```](../glossary/?search=exp)(以自然常数e为底的指数函数),[```log()```](../glossary/?search=log)(对数函数) 和 [```sqrt()```](../glossary/?search=sqrt)(平方根函数)。当你用 Pi 来玩的时候有些方程会变得更有趣。在第 5 行我定义了一个宏,使得每当程序调用 ```PI``` 的时候就用 ```3.14159265359``` 来替换它。 ### Step 和 Smoothstep GLSL 还有一些独特的原生插值函数可以被硬件加速。 -[```step()```](../glossary/?search=step) 插值接收两个参数。第一个是极限或阀值,第二个是我们想要检测或传递的值。对任何小于阀值的值,返回 ```0.0```,大于阀值,则返回 ```1.0```。 +[```step()```](../glossary/?search=step) 插值函数需要输入两个参数。第一个是极限或阀值,第二个是我们想要检测或通过的值。对任何小于阀值的值,返回 ```0.0```,大于阀值,则返回 ```1.0```。 试试看改变下述代码中第 20 行的值。 @@ -45,7 +45,7 @@ GLSL 还有一些独特的原生插值函数可以被硬件加速。 ### 正弦和余弦函数 -当你想用数学来制造动效,形态或混合数值,sin 和 cos 就是你的最佳伙伴。 +当你想用数学来制造动效,形态或去混合数值,sin 和 cos 就是你的最佳伙伴。 这两个基础的三角函数是构造圆的极佳工具,就像张小泉的剪刀一样称手。很重要的一点是你需要知道它们是如何运转的,还有如何把它们结合起来。简单来说,当我们给出一个角度(这里采用弧度制),它就会返回半径为一的圆上一个点的 x 坐标([cos](../glossary/?search=cos))和 y 坐标([sin](../glossary/?search=sin))。正因为 sin 和 cos 返回的是规范化的值(即值域在 -1 和 1 之间),且如此流畅,这就使得它成为一个极其强大的工具。 diff --git a/11/README-ch.md b/11/README-ch.md index 2c3247e..b099cb8 100644 --- a/11/README-ch.md +++ b/11/README-ch.md @@ -45,7 +45,7 @@ In these lines we are doing something similar to what we did in the previous cha 这和之前章节我们做的事情很像。我们把单精度浮点 ```x``` 再分割成它的整数部分 ```i``` 和小数部分 ```f``` 。我们用 [```floor()```](.../glossary/?search=floor) 获取 ```i```,用 [```fract()```](.../glossary/?search=fract) 获取 ```f```。然后我们 ```rand()``` x 的整数部分,即根据这个整数生成一个随机值。 -在这之后有两个被 comment 掉的语句。第一句的作用是线性插值。 +在这之后有两个被注释掉的语句。第一句的作用是线性插值。 After that you see two commented lines. The first one interpolates each random value linearly. @@ -58,7 +58,7 @@ Go ahead and uncomment this line to see how this looks. We use the [```fract()`` At this point in the book, we've learned that we can do better than a linear interpolation, right? Now try uncommenting the following line, which uses a [```smoothstep()```](.../glossary/?search=smoothstep) interpolation instead of a linear one. -试试取消这句的注释(即去掉 ```//``` ),看一下会变成什么样子。注意我们储存在 `f` 中的 [```fract()```](.../glossary/?search=fract) 值混合([```mix()```](.../glossary/?search=mix)了两个随机值。 +试试取消这句的注释(即去掉 ```//``` ),看一下会变成什么样子。注意我们储存在 `f` 中的 [```fract()```](.../glossary/?search=fract) 值混合([```mix()```](.../glossary/?search=mix))了两个随机值。 到本书的这个部分,我们知道我们可以比比线性插值做得更好,不是吗?现在试试取消第二句的注释。第二句用 [```smoothstep()```](.../glossary/?search=smoothstep)进行插值。