当前位置: 首页 > article >正文

WebGL图形编程实战【4】:光影交织 × 逐片元光照与渲染技巧

现实世界中的物体被光线照射时,会反射一部分光。只有当反射光线进人你的眼睛时,你才能够看到物体并辩认出它的颜色。

光源类型

  • 平行光(Directional Light):光线是相互平行的,平行光具有方向。平行光可以看作是无限远处的光源(比如太阳)发出的光。因为太阳距离地球很远,所以阳光到达地球时可以认为是平行的。平行光很简单,可以用一个方向一个颜色来定义
  • 点光源(Point Light):是从一个点向周围的所有方向发出的光。点光源光可以用来表示现实中的灯泡、火焰等。我们需要指定点光源的位置和颜色。光线的方向将根据点光源的位置和被照射之处的位置计算出来,因为点光源的光线的方向在场景内的不同位置是不同的。
  • 环境光(Ambient Light):环境光(间接光)是指那些经光源(点光源或平行光源)发出后,被墙壁等物体多次反射,然后照到物体表面上的光。环境光从各个角度照射物体,其强度都是致的。比如说,在夜间打开冰箱的门,整个厨房都会有些微微亮,这就是环境光的作用。环境光不用指定位置和方向,只需要指定颜色即可。

在这里插入图片描述

反射类型

  • 漫反射(Diffuse Reflection):是针对平行光或点光源而言的。漫反射的反射光在各个方向上是均匀的,如果物体表面像镜子一样光滑,那么光线就会以特定的角度反射出去;但是现实中的大部分材质,比如纸张、岩石、塑料等,其表面都是粗糙的,在这种情况下反射光就会以不固定的角度反射出去。
  • 环境反射(Ambient Reflection):环境反射是针对环境光而言的。在环境反射中,反射光的方向可以认为就是人射光的反方向。由于环境光照射物体的方式就是各方向均匀、强度相等的,所以反射光也是各向均匀的。

漫反射颜色公式

漫反射颜色 = 入射光颜色 * 表面基底色 * cos A

式子中,入射光颜色指的是点光源或平行光的颜色,乘法操作是在颜色矢量上逐分量(R、G、B)进行的。因为漫反射光在各个方向上都是“均匀”的,所以从任何角度看上去其强度都相等。

在这里插入图片描述

环境反射颜色公式

环境反射颜色 = 环境光颜色 * 表面基底色

当漫反射和环境反射同时存在时,将两者加起来,就会得到物体最终被观察到的颜色

在这里插入图片描述

计算入射角

根据入射光的方向和物体表面的朝向(即法线方向)来计算出入射角。在创建三维模型的时候,无法预先确定光线将以怎样的角度照射到每个表面上
但是可以确定每个表面的朝向。在指定光源的时候,再确定光的方向,就可以用这两项信息来计算出入射角了。

在线性代数当中,对矢量n和1作点积运算,公式为:n·1 = |n||1|cosA,其中||符号表示向量的模(长度)。如果两个矢量长度都是1,则点积运算结果为
cosA。

那么就可以对前面漫反射颜色公式进行调整:

漫反射颜色 = 入射光颜色 * 表面基底色 * (光线方向 * 法线方向)

  • 光线方向矢量和表面法线矢量的长度必须为1(单位向量)
  • 光线方向,实际上是入射方向的反方向,即从入射点指向光源方向

法线:表面朝向

物体表面的朝向,即垂直于表面的方向,又称法线或法向量。法向量有三个分量,向量(Nx,Ny,Nz)表示从(0,0,0)到(Nx,Ny,Nz)的方向。

  • 矢量n为(Nx,Ny,Nz)则其长度为|n| = sqrt(Nx^2 + Ny^2 + Nz^2)
  • 对矢量进行归一化后的结果是(Nx/m,Ny/m,Nz/m),其中m是n的的模。如矢量(2.0,2.0,1.0)的长度|n|=sqrt(2.02+2.02+1.0^2)=sqrt(9)
    =3.0,那么归一化后的结果是(2.0/3.0,2.0/3.0,1.0/3.0)

平行光

角度的余弦值

首先来补充一下数学知识,看一下各个角度的余弦值:(这里一起把正弦和正切都加上了)

角度 (°)余弦值 (Cos)正弦值 (Sin)正切值 (Tan)
0100
30√3/21/2√3/3
45√2/2√2/21
601/2√3/2√3
9001无定义 (∞)
120-1/2√3/2-√3
135-√2/2√2/2-1
150-√3/21/2-√3/3
180-100
210-√3/2-1/2√3/3
225-√2/2-√2/21
240-1/2-√3/2√3
2700-1无定义 (-∞)
3001/2-√3/2-√3
315√2/2-√2/2-1
330√3/2-1/2-√3/3
360100

那么再根据前面的入射角的公式,那么我们简单计算一下几个案例,在反射之后的颜色值

漫反射颜色 = 入射光颜色 * 表面基底色 * (光线方向 * 法线方向) = 入射光颜色 * 表面基底色 * cos A

入射光颜色表面基底色角度角度余弦值计算RGB漫反射颜色
(1.0,1.0,1.0) 白色(1.0,0,0)红色01.0R=(1 * 1 * 1)
G=(1 * 0 * 1)
B=(1 * 0 * 1)
(1,0,0)
(1.0,1.0,1.0) 白色(1.0,0,0)红色900R=(1 * 1 * 0)
G=(1 * 0 * 0)
B=(1 * 0 * 0)
(0,0,0)

平行光案例

补充:前面都是采用drawArray方法绘制的正方体,这样的话数组对象太多内容了,看的头都晕了,还可以采用drawElements对前面的代码进行重构优化一下。

数据对象可以进行一个拆分。boxArray数组表示的是每一个面的四个顶点的坐标位置,以第一行为例,就是从v0-v1-v2-v3的位置。那么对应的index就表示顶点位置的索引(因为一个正方形要拆分成两个三角形,这也是这里的index一行为什么是6个数据的原因)。

    //    v6----- v5//   /|      /|//  v1------v0|//  | |     | |//  | |v7---|-|v4//  |/      |///  v2------v3let boxArray = [1.0, 1.0, 1.0, 1.0, -1.0, 1.0, 1.0, 1.0, -1.0, -1.0, 1.0, 1.0, 1.0, -1.0, 1.0, 1.0, // v0-v1-v2-v31.0, 1.0, 1.0, 1.0, 1.0, -1.0, 1.0, 1.0, 1.0, -1.0, -1.0, 1.0, 1.0, 1.0, -1.0, 1.0, // v0-v3-v4-v51.0, 1.0, 1.0, 1.0, 1.0, 1.0, -1.0, 1.0, -1.0, 1.0, -1.0, 1.0, -1.0, 1.0, 1.0, 1.0, // v0-v5-v6-v1-1.0, 1.0, 1.0, 1.0, -1.0, 1.0, -1.0, 1.0, -1.0, -1.0, -1.0, 1.0, -1.0, -1.0, 1.0, 1.0, // v1-v6-v7-v2-1.0, -1.0, -1.0, 1.0, 1.0, -1.0, -1.0, 1.0, 1.0, -1.0, 1.0, 1.0, -1.0, -1.0, 1.0, 1.0, // v7-v4-v3-v21.0, -1.0, -1.0, 1.0, -1.0, -1.0, -1.0, 1.0, -1.0, 1.0, -1.0, 1.0, 1.0, 1.0, -1.0, 1.0 // v4-v7-v6-v5
];let index = [0, 1, 2, 0, 2, 3,    // front4, 5, 6, 4, 6, 7,    // right8, 9, 10, 8, 10, 11,    // up12, 13, 14, 12, 14, 15,    // left16, 17, 18, 16, 18, 19,    // down20, 21, 22, 20, 22, 23     // back
];

后面进行数据组合的方法和之前是一样的。注意一下绑定的着色器的变量即可,以及最后drawElements方法,

let pointPosition = new Float32Array(boxArray);
let aPsotion = webGL.getAttribLocation(program, 'a_position');
let triangleBuffer = webGL.createBuffer();
webGL.bindBuffer(webGL.ARRAY_BUFFER, triangleBuffer);
webGL.bufferData(webGL.ARRAY_BUFFER, pointPosition, webGL.STATIC_DRAW);
webGL.enableVertexAttribArray(aPsotion);
webGL.vertexAttribPointer(aPsotion, 4, webGL.FLOAT, false, 4 * 4, 0);let indexBuffer = webGL.createBuffer();
let indices = new Uint8Array(index);
webGL.bindBuffer(webGL.ELEMENT_ARRAY_BUFFER, indexBuffer);
webGL.bufferData(webGL.ELEMENT_ARRAY_BUFFER, indices, webGL.STATIC_DRAW);webGL.drawElements(webGL.TRIANGLES, 36, webGL.UNSIGNED_BYTE, 0);

平行光案例实现:调整着色器代码,看一下整个着色器代码调整的完整流程。

graph TBsubgraph 顶点着色器 by modifyA(顶点坐标 a_position)B(透视投影 u_formMatrix)C(法向量 a_Normal)D(光照方向 u_LightDirection)E(漫射光 u_DiffuseLight)F(环境光 u_AmbientLight)G(颜色 v_Color)endsubgraph 片元着色器Z(v_Color)endC --> C1(归一化法向量 normalize)D --> D1(归一化光线方向 normalize)C1 -- dot计算点积、max取最大值 --> H(法向量与光线方向的点积)D1 --> HE --> I(计算漫反射颜色)H --> IF --> F1(计算环境光颜色)F1 -- 相加 --> J(颜色合并)I -- 相加 --> JG -- 利用varying变量传值 --> 片元着色器J --> 片元着色器

通过这个流程图也就结合了前面计算漫反射公式得到了漫反射的颜色,所以最后在片元着色器中利用varying变量传值,进行颜色合并。那么也就渲染到了物体上。

let vertexString = `attribute vec4 a_position;uniform mat4 u_formMatrix;attribute vec4 a_Normal;uniform vec3 u_LightDirection;uniform vec3 u_DiffuseLight;uniform vec3 u_AmbientLight;varying vec4 v_Color;void main(void){gl_Position = u_formMatrix * a_position;vec3 normal = normalize(a_Normal.xyz);vec3 LightDirection = normalize(u_LightDirection.xyz);float nDotL = max(dot(LightDirection, normal), 0.0);vec3 diffuse = u_DiffuseLight * vec3(1.0,0,1.0)* nDotL;vec3 ambient = u_AmbientLight * vec3(1.0,0,1.0);v_Color = vec4(diffuse + ambient, 1);}`;
let fragmentString = `precision mediump float;varying vec4 v_Color;void main(void){gl_FragColor =v_Color;}`;

第二步就是设置法向量和光线方向,以及漫反射和环境光。而后结合前面的通过drawElements进行绘制。那也就完成了平行光案例。

let normals = new Float32Array([0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0,  // v0-v1-v2-v3 front1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0,  // v0-v3-v4-v5 right0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0,  // v0-v5-v6-v1 up-1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0,  // v1-v6-v7-v2 left0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0,  // v7-v4-v3-v2 down0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0, 0.0, 0.0, -1.0   // v4-v7-v6-v5 back
]);
let aNormal = webGL.getAttribLocation(program, 'a_Normal');
let normalsBuffer = webGL.createBuffer();
let normalsArr = new Float32Array(normals);
webGL.bindBuffer(webGL.ARRAY_BUFFER, normalsBuffer);
webGL.bufferData(webGL.ARRAY_BUFFER, normalsArr, webGL.STATIC_DRAW);
webGL.enableVertexAttribArray(aNormal);
webGL.vertexAttribPointer(aNormal, 3, webGL.FLOAT, false, 3 * 4, 0);let u_DiffuseLight = webGL.getUniformLocation(program, 'u_DiffuseLight');
webGL.uniform3f(u_DiffuseLight, 1.0, 1.0, 1.0);
let u_LightDirection = webGL.getUniformLocation(program, 'u_LightDirection');
webGL.uniform3fv(u_LightDirection, [0, 0, 10.0]);
let u_AmbientLight = webGL.getUniformLocation(program, 'u_AmbientLight');
webGL.uniform3f(u_AmbientLight, 0.2, 0.2, 0.2);

在这里插入图片描述

点光源

漫反射光颜色 = 入射光颜色 * 表面基底色 * cos A

cos A = 光线方向 * 法线方向

在点光源是没有光照方向的,光照方向需要通过光源位置-顶点位置来计算。两者相减就会得到入射光方向向量。这样就需要调整一下着色器代码。

  • 新增变量:u_PointLightPosition,u_NormalMatrix(法线变换矩阵)
  • 计算normal,将法线向量从模型空间转换到视图空间或世界空间
  • 计算入射光方向向量
let vertexString = `attribute vec4 a_position;uniform mat4 u_formMatrix;attribute vec4 a_Normal;uniform vec3 u_PointLightPosition;uniform vec3 u_DiffuseLight;uniform vec3 u_AmbientLight;varying vec4 v_Color;uniform mat4 u_NormalMatrix;void main(void){gl_Position = u_formMatrix * a_position;vec3 normal = normalize(vec3(u_NormalMatrix * a_Normal));vec3 LightDirection = normalize(vec3(gl_Position.xyz) - u_PointLightPosition);float nDotL = max(dot(LightDirection, normal), 0.0);vec3 diffuse = u_DiffuseLight * vec3(1.0,0,1.0)* nDotL;vec3 ambient = u_AmbientLight * vec3(1.0,0,1.0);v_Color = vec4(diffuse + ambient, 1);}`;

接着就是在js当中设置u_PointLightPosition,u_NormalMatrix。

let u_PointLightPosition = webGL.getUniformLocation(program, 'u_PointLightPosition');
webGL.uniform3fv(u_PointLightPosition, [10, 0, 0]);let uniformNormalMatrix = webGL.getUniformLocation(program, 'u_NormalMatrix');
let normalMatrix = mat4.create();
mat4.identity(normalMatrix);
mat4.invert(normalMatrix, ModelMatrix);
mat4.transpose(normalMatrix, ModelMatrix);
webGL.uniformMatrix4fv(uniformNormalMatrix, false, normalMatrix);

在这里插入图片描述

环境光

环境光相对于平行光和点光源来说,相对简单些,不用再去计算漫反射光了,只需要计算环境光。那么其着色器代码调整如下:只需要传递一个环境光进来,然后直接和基底色相乘就是渲染后的颜色了。

let vertexString = `attribute vec4 a_position;uniform mat4 u_formMatrix;uniform vec3 u_AmbientLight;varying vec4 v_Color;void main(void){gl_Position = u_formMatrix * a_position;vec3 ambient = u_AmbientLight * vec3(1.0,1.0,1.0);v_Color = vec4(ambient, 1);}`;

传值也将其他的都进行删去,设置u_AmbientLight即可。那么这里的值就是(0.8,0.1,0)颜色值就是 (2550.8, 2550, 255*0.1) = (
204,0,51) 橙红色。

let u_AmbientLight = webGL.getUniformLocation(program, 'u_AmbientLight');
webGL.uniform3f(u_AmbientLight, 0.8, 0.1, 0);

在这里插入图片描述

逐片元光照

再来先回顾一下webGL整个渲染的流程

js
缓冲区对象
顶点着色器
顶点坐标
图形装配
光栅化
片元着色器
浏览器

逐顶点着色

在逐顶点渲染中,前面讲的光照或颜色的计算是在顶点着色器中进行的,顶点着色器运行结束后,每一个顶点都有一个颜色值,在片元着色器执行前,webGL会对这些顶点的颜色数据进行线性插值,从而得到每个片元处的颜色。这就是webGL绘制三角形的原理,为什么只给了3个顶点的颜色值就能得到一个彩色的三角形的缘故,即三角形中其他点(片元)的颜色值都是通过这给定的3个顶点的颜色值通过线性插值得到的。

在这里插入图片描述

逐片元着色

每个像素都被填充了光栅化处理后的颜色,并写入颜色缓冲区,直到最后一个片元被处理完成,浏览器就会显示出最终的彩色三角形

逐片元的计算光照条件:

  • 片元在世界坐标系下的坐标。
  • 片元处表面的法向量。可以在顶点着色器中,将顶点的世界坐标和法向量以varying变量的形式传人片元着色器,片元着色器中的同名变量就已经是内插后的逐片元值了。

绘制球

在前面绘制立体图形都是长方体这种可以确定具体的顶点坐标,那么绘制球体的时候我们怎么拿到对应的坐标再进行绘制呢?

球体任意一点点坐标

如下图所示,这是一个球,现在已知半径为r,求球上一点P的坐标,其中该点与中心点连线与z轴的夹角为θ,该点往平面做投影,投影到中心点连线和x轴的夹角为φ。
在这里插入图片描述

那么就可以得到p点的xyz坐标:并且现在只需要将φ转360度,θ转180度,即可得到球上任意一点的xyz坐标。

  • x=rsinθcosφ
  • y=rsinθsinφ
  • z=rcosθ
webGL渲染球体(逐顶点着色)

在webGL当中所有的图形都是通过很多个三角形进行组成的,下面开始计算球体的顶点坐标:也就是将上面的数学公式转成js代码。(在前面所有学习和实现的效果都是采用的逐顶点着色,也就是js将颜色值传递到顶点着色器当中,顶点着色器将所有的颜色都处理好了之后再通过varying传递给片元着色器)

let positions = [];
const SPHERE_DIV = 10;let i, ai, si, ci;
let j, aj, sj, cj;for (j = 0; j <= SPHERE_DIV; j++) {aj = j * Math.PI / SPHERE_DIV;sj = Math.sin(aj);cj = Math.cos(aj);for (i = 0; i <= SPHERE_DIV; i++) {ai = i * 2 * Math.PI / SPHERE_DIV;si = Math.sin(ai);ci = Math.cos(ai);positions.push(ci * sj);  // Xpositions.push(cj);       // Ypositions.push(si * sj);  // Z}
}webgl.drawArrays(webgl.TRIANGLES, 0, positions.length / 3);

使用drawArrays进行渲染,直接根据顶点缓冲区的数据顺序绘制。这里的顶点数量不够,因为只计算了一些点,并且这些点没有复用,组成的三角形不能完全覆盖球体,所以就是这种效果

在这里插入图片描述

改用drawElements进行渲染,需要再加上计算点索引的数组的代码。

let p1, p2;for (j = 0; j < SPHERE_DIV; j++) {for (i = 0; i < SPHERE_DIV; i++) {p1 = j * (SPHERE_DIV + 1) + i;p2 = p1 + (SPHERE_DIV + 1);indices.push(p1);indices.push(p2);indices.push(p1 + 1);indices.push(p1 + 1);indices.push(p2);indices.push(p2 + 1);}
}webGL.drawElements(webGL.TRIANGLES, indices.length, webGL.UNSIGNED_BYTE, 0);

在这里插入图片描述

webGL渲染球体(逐片元着色)

逐片元着色和逐顶点着色的区别就是,逐片元着色是在片元着色器中计算光照,逐顶点着色是在顶点着色器中计算光照。那么就调整一下着色器代码

let vertexString = `attribute vec4 a_position;uniform mat4 u_formMatrix;attribute vec4 a_Normal;varying vec4 v_Normal;varying vec4 v_position;void main(void){gl_Position = u_formMatrix * a_position;v_position = gl_Position;v_Normal= a_Normal;}`;
let fragmentString = `precision mediump float;varying vec4 v_Normal;varying vec4 v_position;uniform vec3 u_PointLightPosition;uniform vec3 u_DiffuseLight;uniform vec3 u_AmbientLight;void main(void){vec3 normal = normalize(v_Normal.xyz);vec3 lightDirection = normalize(u_PointLightPosition - vec3(v_position.xyz));float nDotL = max(dot(lightDirection, normal), 0.0);vec3 diffuse = u_DiffuseLight * vec3(1.0,0,1.0) * nDotL;vec3 ambient = u_AmbientLight * vec3(1.0,0,1.0);gl_FragColor = vec4(diffuse + ambient, 1);}`;

相关文章:

WebGL图形编程实战【4】:光影交织 × 逐片元光照与渲染技巧

现实世界中的物体被光线照射时&#xff0c;会反射一部分光。只有当反射光线进人你的眼睛时&#xff0c;你才能够看到物体并辩认出它的颜色。 光源类型 平行光&#xff08;Directional Light&#xff09;&#xff1a;光线是相互平行的&#xff0c;平行光具有方向。平行光可以看…...

Java高频面试之并发编程-07

hello啊&#xff0c;各位观众姥爷们&#xff01;&#xff01;&#xff01;本baby今天来报道了&#xff01;哈哈哈哈哈嗝&#x1f436; 面试官&#xff1a;线程之间有哪些通信方式&#xff1f; 在 Java 多线程编程中&#xff0c;线程间通信&#xff08;Inter-Thread Communica…...

粒子群优化算法(Particle Swarm Optimization, PSO)的详细解读

最近研究基于进化算法的神经网络架构搜索&#xff0c;仔细阅读了TEVC2023年发表的一篇NAS搜索的文章&#xff0c;觉得收益颇多&#xff0c;对比NSGA-2&#xff0c;这里给出PSO的详细解释。【本人目前研究的是多目标进化算法&#xff0c;欢迎交流、留言】 文章题目是&#xff1…...

.NET代码保护混淆和软件许可系统——Eziriz .NET Reactor 7

.NET代码保护混淆和软件许可系统——Eziriz .NET Reactor 7 1、简介2、功能特点3、知识产权保护功能4、强大的许可系统5、软件开发工具包6、部署方式7、下载 1、简介 .NET Reactor是用于为.NET Framework编写的软件的功能强大的代码保护和软件许可系统&#xff0c;并且支持生成…...

【现代深度学习技术】循环神经网络06:循环神经网络的简洁实现

【作者主页】Francek Chen 【专栏介绍】 ⌈ ⌈ ⌈PyTorch深度学习 ⌋ ⌋ ⌋ 深度学习 (DL, Deep Learning) 特指基于深层神经网络模型和方法的机器学习。它是在统计机器学习、人工神经网络等算法模型基础上&#xff0c;结合当代大数据和大算力的发展而发展出来的。深度学习最重…...

【办公类-89-02】20250424会议记录模版WORD自动添加空格补全下划线

背景需求 4月23日听了一个MJB的征文培训&#xff0c;需要写会议记录 把资料黏贴到模版后&#xff0c;发现每行需要有画满下划线 原来做这套资料&#xff0c;就是手动按空格到一行末&#xff0c;有空格才会出现下划线&#xff0c;也就是要按很多的空格&#xff08;凑满一行&…...

解释器模式:自定义语言解析与执行的设计模式

解释器模式&#xff1a;自定义语言解析与执行的设计模式 一、模式核心&#xff1a;定义语言文法并实现解释器处理句子 在软件开发中&#xff0c;当需要处理特定领域的语言&#xff08;如数学表达式、正则表达式、自定义配置语言&#xff09;时&#xff0c;可以通过解释器模式…...

​​了解互联网

本文来源 &#xff1a; 腾讯元宝 克劳德香农&#xff08;Claude Shannon&#xff09; 信息时代之父​​ 克劳德香农&#xff08;Claude Shannon&#xff0c;1916-2001&#xff09;是20世纪最具影响力的数学家和工程师之一&#xff0c;被誉为​​“信息论之父”​​和​​“数字…...

Vue和React项目中,统一监听页面错误需要结合框架提供的错误处理机制与JavaScript原生方法

在Vue和React项目中&#xff0c;统一监听页面错误需要结合框架提供的错误处理机制与JavaScript原生方法&#xff0c;以下是具体方案及实现原理&#xff1a; Vue项目统一监听错误 errorCaptured生命周期钩子134 作用&#xff1a;监听所有下级组件的报错&#xff0c;可返回fals…...

AI催生DLP新战场 | 天空卫士连续6年入选Gartner 全球数据防泄漏(DLP)市场指南

“管理数据外泄风险仍然是企业的重大挑战之一&#xff0c;客户处出于各种因素寻求DLP。最近&#xff0c;一些组织对使用DLP控制机器对敏感信息的访问表现出很大兴趣。 随着生成式人工智能&#xff08;GenAI&#xff09;的运用和数据的不断扩散&#xff0c;数据外泄的问题变得更…...

23种设计模式-行为型模式之策略模式(Java版本)

Java 策略模式&#xff08;Strategy Pattern&#xff09;详解 &#x1f9e0; 什么是策略模式&#xff1f; 策略模式是一种行为型设计模式&#xff0c;它定义了一系列算法&#xff0c;把它们一个个封装起来&#xff0c;并且使它们可以互相替换。策略模式让算法独立于使用它的客…...

Adobe After Effects的插件--------Optical Flares之Lens Objects参数

Lens Objects,即【镜头对象】。 通用设置 全局参数发光多光圈光圈条纹微光反射钉球闪光圆环箍焦散镜头球缩放✔✔✔✔✔✔✔✔✔✔✔✔✔缩放偏移✔长宽比✔✔✔✔✔✔✔✔✔✔✔✔✔混合模式✔颜色✔全局种子✔亮度✔✔✔✔✔✔✔✔✔✔✔✔拉伸✔✔✔✔✔✔✔✔✔✔✔✔距离…...

使用Matlab工具将RAW文件转化为TXT文件,用于FPGA仿真输入

FPGA实现图像处理算法时&#xff0c;通常需要将图像作为TestBench的数据输入。 使用VHDL编写TestBench时&#xff0c;只能读取二进制TXT文件。 现在提供代码&#xff0c;用于实现RAW图像读取&#xff0c;图像显示&#xff0c;图像转化为二进制数据并存入TXT文件中。 clc; cl…...

【问题】解决docker的方式安装n8n,找不到docker.n8n.io/n8nio/n8n:latest镜像的问题

问题概览 用docker方式安装n8n&#xff0c;遇到错误&#xff0c;安装不了的问题&#xff1a; Unable to find image docker.n8n.io/n8nio/n8n:latest locally docker: Error response from daemon: Get "https://registry-1.docker.io/v2/": net/http: request can…...

【网络】TCP/IP协议学习

学TCP/IP最好的方法是阅读lwip源码。 1. 资料 什么是SYN Flood&#xff1f;DoS 和 DDoS 攻击&#xff0c;一个字母之差&#xff0c;到底区别在哪&#xff1f; 2. 技术要点&#xff1a; 技术要点要结合源码&#xff0c;以及向AI提问来理解&#xff0c;否则真的很难理解&…...

系统与网络安全------弹性交换网络(1)

资料整理于网络资料、书本资料、AI&#xff0c;仅供个人学习参考。 Trunk原理与配置 Trunk原理概述 Trunk&#xff08;虚拟局域网中继技术&#xff09;是指能让连接在不同交换机上的相同VLAN中的主机互通。 VLAN内通信 实现跨交换的同VLAN通信&#xff0c;通过Trunk链路&am…...

10天学会嵌入式技术之51单片机-day-3

第九章 独立按键 按键的作用相当于一个开关&#xff0c;按下时接通&#xff08;或断开&#xff09;&#xff0c;松开后断开&#xff08;或接通&#xff09;。实物图、原理图、封装 9.2 需求描述 通过 SW1、SW2、SW3、SW4 四个独立按键分别控制 LED1、LED2、LED3、LED4 的亮…...

深入解析微软MarkitDown:原理、应用与二次开发指南

一、项目背景与技术定位 微软开源的MarkitDown并非简单的又一个Markdown解析器&#xff0c;而是针对现代文档处理需求设计的工具链核心组件。该项目诞生于微软内部大规模文档系统的开发实践&#xff0c;旨在解决以下技术痛点&#xff1a; 大规模文档处理性能&#xff1a;能够高…...

【PVCodeNet】《Palm Vein Recognition Network Combining Transformer and CNN》

[1]吴凯,沈文忠,贾丁丁,等.融合Transformer和CNN的手掌静脉识别网络[J].计算机工程与应用,2023,59(24):98-109. 文章目录 1、Background and Motivation2、Related Work3、Advantages / Contributions4、Method5、Experiments5.1、Datasets and Metrics5.2、Hyper-parameters5.…...

CentOS 7 磁盘分区详细教程

CentOS 7 磁盘分区详细教程 在服务器管理和运维过程中&#xff0c;磁盘分区是一项基础且重要的操作。合理的磁盘分区可以提高数据存储的安全性、高效性&#xff0c;方便系统管理与维护。本文将详细介绍在 CentOS 7 系统中进行磁盘分区的具体步骤和方法。 一、准备工作 1.1 确…...

从青涩到 AI:我与评估程序的三十年 “纠缠” 与重启(参数化)

接上篇&#xff1a;从青涩到 AI&#xff1a;我与评估程序的三十年 “纠缠” 与重启   主要对参数配置和模板文件处理进行了改动&#xff0c;将可参数化的数据放到了config.yaml文件中&#xff0c;再一个将模板文件&#xff08;评估模板.xlsx&#xff09;分离为(7年级模板.xls…...

x-cmd install | brows - 终端里的 GitHub Releases 浏览器,告别繁琐下载!

目录 核心功能与优势安装适用场景 还在为寻找 GitHub 项目的特定 Release 版本而苦恼吗&#xff1f;还在网页上翻来覆去地查找下载链接吗&#xff1f;现在&#xff0c;有了 brows&#xff0c;一切都将变得简单高效&#xff01; brows 是一款专为终端设计的 GitHub Releases 浏览…...

【python】如何将文件夹及其子文件夹下的所有word文件汇总导出到一个excel文件里?

根据你的需求,这里提供一套完整的Python解决方案,支持递归遍历子文件夹、提取Word文档内容(段落+表格),并整合到Excel中。以下是代码实现及详细说明: 一个单元格一个word的全部内容 完整代码 # -*- coding: utf-8 -*- import os from docx import Document import pand…...

C++ 封装成DLL,C#调用

目录 前言 一、C DLL 封装 二、C# 调用 DLL 1、创建 C# 控制台项目&#xff0c;调用 三、注意事项 前言 在实际工程开发中&#xff0c;跨语言调用是常见的需求&#xff0c;尤其是在性能要求较高的模块中&#xff0c;常常采用 C 实现核心算法逻辑&#xff0c;并通过封装为 D…...

多模态知识图谱:重构大模型RAG效能新边界

当前企业级RAG&#xff08;Retrieval-Augmented Generation&#xff09;系统在非结构化数据处理中面临四大核心问题&#xff1a; 数据孤岛效应&#xff1a;异构数据源&#xff08;文档/表格/图像/视频&#xff09;独立存储&#xff0c;缺乏跨模态语义关联&#xff0c;导致知识检…...

实验八 版本控制

实验八 版本控制 一、实验目的 掌握Git基本命令的使用。 二、实验内容 1.理解版本控制工具的意义。 2.安装Windows和Linux下的git工具。 3.利用git bash结合常用Linux命令管理文件和目录。 4.利用git创建本地仓库并进行简单的版本控制实验。 三、主要实验步骤 1.下载并安…...

微服务相比传统服务的优势

这是一道面试题&#xff0c;咱们先来分析这道题考察的是什么。 如果分析面试官主要考察以下几个方面&#xff1a; 技术理解深度 你是否清楚微服务架构&#xff08;Microservices&#xff09;和传统单体架构&#xff08;Monolithic&#xff09;的本质区别。能否从设计理念、技术…...

JavaWeb:Web介绍

Web开篇 什么是web? Web网站工作流程 网站开发模式 Web前端开发 初识web Web标准 HtmlCss 什么是Html? 什么是CSS?...

教育行业网络安全:守护学校终端安全,筑牢教育行业网络安全防线!

教育行业面临的终端安全问题日益突出&#xff0c;主要源于教育信息化进程的加速、终端设备多样化以及网络环境的开放性。 以下是教育行业终端安全面临的主要挑战&#xff1a; 1、设备类型复杂化 问题&#xff1a;教育机构使用的终端设备包括PC、服务器等&#xff0c;操作系统…...

【论文速递】2025年04周 (Robotics/Embodied AI/LLM)

目录 DeepSeek-R1: Incentivizing Reasoning Capability in LLMs via Reinforcement Learning摘要 Evolving Deeper LLM Thinking摘要 Kimi k1.5: Scaling Reinforcement Learning with LLMs摘要 Agent-R: Training Language Model Agents to Reflect via Iterative Self-Train…...