- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在试验 Three.js ShaderMaterial 并尝试实现照明。
我有 r70 的工作代码,但相同的代码(稍作更改 - MAX_POINT_LIGHTS 常量已重命名为 NUM_POINT_LIGHTS)不适用于 r76。
查看 WebGL Inspector 中的跟踪,很明显没有光数据被发送到着色器。那么,是灯光坏了还是我需要设置其他东西才能让它工作?
使用 r70(工作)
http://codepen.io/anon/pen/KzjXNr?editors=1010
片段着色器
uniform vec3 diffuse;
varying vec3 vPos;
varying vec3 vNormal;
uniform vec3 pointLightColor[MAX_POINT_LIGHTS];
uniform vec3 pointLightPosition[MAX_POINT_LIGHTS];
uniform float pointLightDistance[MAX_POINT_LIGHTS];
void main() {
vec4 addedLights = vec4(0.1, 0.1, 0.1, 1.0);
for(int l = 0; l < MAX_POINT_LIGHTS; l++) {
vec3 lightDirection = normalize(vPos - pointLightPosition[l]);
addedLights.rgb += clamp(dot(-lightDirection, vNormal), 0.0, 1.0) * pointLightColor[l];
}
gl_FragColor = addedLights;
}
var uniforms = THREE.UniformsUtils.merge([
THREE.UniformsLib['lights'],
{ diffuse: { type: 'c', value: new THREE.Color(0xff00ff) } }
]);
var vertexShader = document.getElementById('vertexShader').text;
var fragmentShader = document.getElementById('fragmentShader').text;
material = new THREE.ShaderMaterial({
uniforms: uniforms,
vertexShader: vertexShader,
fragmentShader: fragmentShader,
lights: true
});
var geometry = new THREE.BoxGeometry(200, 200, 200);
mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);
uniform vec3 diffuse;
varying vec3 vPos;
varying vec3 vNormal;
uniform vec3 pointLightColor[NUM_POINT_LIGHTS];
uniform vec3 pointLightPosition[NUM_POINT_LIGHTS];
uniform float pointLightDistance[NUM_POINT_LIGHTS];
void main() {
vec4 addedLights = vec4(0.1, 0.1, 0.1, 1.0);
for(int l = 0; l < NUM_POINT_LIGHTS; l++) {
vec3 lightDirection = normalize(vPos - pointLightPosition[l]);
addedLights.rgb += clamp(dot(-lightDirection, vNormal), 0.0, 1.0) * pointLightColor[l];
}
gl_FragColor = addedLights;
}
最佳答案
浅色制服已更改为 struct
s 在 r74 (特别是在 #7324 中)。请注意,虽然更改为 struct
s 发生在 r74 中,以下适用于 r75 及更高版本。struct
的单个数组s 是针对每种灯光类型给出的。每个struct
有 position
和 color
你需要的属性。
片段着色器
uniform vec3 diffuse;
varying vec3 vPos;
varying vec3 vNormal;
struct PointLight {
vec3 position;
vec3 color;
};
uniform PointLight pointLights[ NUM_POINT_LIGHTS ];
void main() {
vec4 addedLights = vec4(0.1, 0.1, 0.1, 1.0);
for(int l = 0; l < NUM_POINT_LIGHTS; l++) {
vec3 adjustedLight = pointLights[l].position + cameraPosition;
vec3 lightDirection = normalize(vPos - adjustedLight);
addedLights.rgb += clamp(dot(-lightDirection, vNormal), 0.0, 1.0) * pointLights[l].color;
}
gl_FragColor = addedLights;//mix(vec4(diffuse.x, diffuse.y, diffuse.z, 1.0), addedLights, addedLights);
}
关于Three.js ShaderMaterial 照明不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37342114/
我正在练习我的 Javascript,所以我制作了一个跟随鼠标的功能。我成功了,但现在我有了一个新想法,但我不确定是否可行。 有没有办法让“视觉球体”跟随鼠标,以便该区域中的所有内容都可见?。有点像使
对my question的回答表明 DOT3 光照可以帮助 OpenGL ES 渲染,但我很难找到 DOT3 光照的合适定义。 编辑 1 非常感谢 iPhone 相关信息。 最佳答案 DOT3 照明通
所以我一直在研究照明,为了阴影贴图的目的,我根据半径而不是三个衰减因子(常数、线性和二次)进行光衰减,而且,嗯......它看起来不太好靠近边缘。 /image/H680a.png 它切断得非常快,着
我已经问过这个问题了,但没有得到答案。顺便说一句,我发现了一些新东西。我想显示由 Solid Works 导出的 WRL 文件的 3D 模型。该文件包含三角形的顶点,我用 glBegin(GL_TRI
我在我的 JOGL 项目中添加了一个光源,当物体静止时,它似乎工作得很好,当我移动相机时,它随着它旋转而逐渐变暗,这是我所期望的,但一旦它旋转 90 度屏幕完全黑了,有人知道这是为什么吗?另一侧是否需
我正在尝试使用 iPhone LED 执行渐进式照明。为此,我尝试使用 setTorchModeOnWithLevel 方法, float 值定期增加,从 0.1 到 AVCaptureMaxAvai
我有一个我无法解决的问题。我刚刚在我的项目中添加了一个点光源,它使纹理完全变黑。我不知道为什么。 我认为这可能是法线没有正确更新,也可能是 s.x、s.y 和 s.z 的计算。 如果有人有时间看一下并
我有一张碰撞图,有些地方我想成为光源。光源提供的光实际上是我可以看到地面的形状。现在看起来像这样: 所以光线穿过墙壁。我想让它看起来像这样: (我用深黄色标记了与墙壁的碰撞) 因此光线在遇到墙壁时停止
我正在阅读 opengl.org 中的以下 Phong 照明着色器: Phong Illumination in Opengl.org 顶点和片段着色器如下: 顶点着色器: varying vec3
我读过的几乎所有文章和书籍都指出最终颜色的构成是:finalColor = ambientColor + lambertianTerm * diffuseColor (= material color
我一直在尝试检测移动的车辆。但是由于云的不同光照条件(不是云的阴影,只是照明)背景减法失败。 我已经在这里上传了我的输入视频 --> Youtube (30secs) 这是我使用 opencv 中可用
我只想点亮键盘上的一个键 (Logitech G910),同时设置鼠标颜色(罗技G303)。 在键盘上设置一个键可以正常工作,但是如果不同时将键盘上的所有键都设置为该颜色,我就无法设置鼠标的颜色。 我
我正在尝试获取 Logitech's own LED SDK使用我的 G502,但我不能。我使用的是 SDK 版本 8.82.7,这是目前最新的版本。我在 SO 或互联网的其他部分也找不到任何东西,所
因为我是着色器的完全菜鸟,所以我在尝试使用 2D 照明系统时遇到了一些问题,该系统基本上用 2D 黑色纹理覆盖屏幕,在亮区所在的位置有透明孔。 因为我只使用一个纹理,所以我想我必须在片段着色器中执行此
我试图使用此处的代码在 Laravel 中创建迁移。但不幸的是它会弹出一个像这里给出的错误。我看到了一些我手动创建表的答案..但这与迁移的整个想法非常相悖..不是吗? 迁移文件 2018_05_05_
我是一名优秀的程序员,十分优秀!