诸君请看!这CSDN

CSDN

越来越百度化,查个资料,跟甜蜜的购物平台一样,疯狂广告输出,跟个地痞一样。
这CSDN 是不是忘了初心,恶心。

下面是一个简单的three.js局部辉光的代码案例: ```javascript // 创建场景、相机和渲染器 var scene = new THREE.Scene(); var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); var renderer = new THREE.WebGLRenderer({ antialias: true }); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); // 添加一个立方体到场景中 var geometry = new THREE.BoxGeometry(1, 1, 1); var material = new THREE.MeshBasicMaterial({ color: 0xffffff }); var cube = new THREE.Mesh(geometry, material); scene.add(cube); // 创建一个发光材质 var glowMaterial = new THREE.ShaderMaterial({ uniforms: { "c": { type: "f", value: 1.0 }, "p": { type: "f", value: 1.4 }, glowColor: { type: "c", value: new THREE.Color(0xffffff) }, viewVector: { type: "v3", value: camera.position } }, vertexShader: ` uniform vec3 viewVector; uniform float c; uniform float p; varying float intensity; void main() { vec3 vNormal = normalize(normalMatrix * normal); vec3 vNormel = normalize(normalMatrix * viewVector); intensity = pow(c - dot(vNormal, vNormel), p); gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0); } `, fragmentShader: ` uniform vec3 glowColor; varying float intensity; void main() { vec3 glow = glowColor * intensity; gl_FragColor = vec4(glow, 1.0); } `, side: THREE.FrontSide, blending: THREE.AdditiveBlending, transparent: true }); // 创建一个发光的立方体 var glowCube = new THREE.Mesh(geometry, glowMaterial.clone()); glowCube.position.copy(cube.position); glowCube.scale.multiplyScalar(1.2); scene.add(glowCube); // 渲染场景 function render() { requestAnimationFrame(render); cube.rotation.x += 0.01; cube.rotation.y += 0.01; glowMaterial.uniforms.viewVector.value = new THREE.Vector3().subVectors(camera.position, glowCube.position); renderer.render(scene, camera); } render(); ``` 在这个案例中,我们首先创建了一个场景、相机和渲染器,并添加了一个普通的立方体到场景中。然后,我们创建了一个发光材质,其中包含了顶点着色器和片段着色器。顶点着色器计算了每个顶点的光照强度,而片段着色器根据这个强度计算出发光的颜色。接着,我们创建了一个发光的立方体,它使用了这个发光材质,并且放置在普通立方体的上方,稍微比它大一些。最后,我们在渲染循环中更新了光照强度和发光材质的视图向量,以便它能够跟随相机的位置。 运行这个案例,你将会看到一个普通的立方体和它上方的发光立方体。发光立方体已经被设置为只在正面渲染,并且使用了加法混合模式,这使得它看起来更加亮眼。随着相机的移动,发光立方体的颜色也会发生变化,这是因为它的发光效果是基于相机位置计算的。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值