three.js 杂记
clip:
1:
着色器
#ifdef USE_CLIP_DISTANCE
vec4 worldPosition = modelMatrix * vec4( position, 1.0 );
gl_ClipDistance[ 0 ] = worldPosition.x - sin( time ) * ( 0.5 );
#endif
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
shaderMe~:
启用clipCullDistance
属性后,开发者可以通过设置材质的clipDistances
属性来定义剪裁平面。这个属性通常是一个数组,包含了每个剪裁平面的距离值。同样,cullDistances
属性可以用来设置剔除距离。
material.extensions.clipCullDistance = true;
2:
renderer.clippingPlanes=new THREE.Plane~;
renderer.localClippingEnabled
material.clippingPlanes=~
material.clipIntersection true/false
更改剪裁平面的行为,以便仅剪切其交叉点,而不是它们的并集
其他 clipShadows,alphaToCoverage,stencilFail,stencilZFail,stencilZPass
DecalGeometry 贴花效果网格
//红蓝视觉效果
effect = new AnaglyphEffect( renderer );
effect.setSize( width, height );
effect.render( scene, camera );
AsciiEffect
ParallaxBarrierEffect 实现视差屏障效果。这个效果通常用于创建3D场景中的深度感,通过让不同深度的物体以不同的速度移动来模拟人眼观察真实世界时的视差效果
PeppersGhostEffect是一种特殊的WebGL效果,它可以创建一种视觉上的“幽灵”效果,通常用于增强场景中的透明度和深度感
StereoEffect是一个用于在WebGL渲染中创建立体视觉效果的类或函数 vr
textureCube.mapping = THREE.CubeRefractionMapping;
可以创建一个场景中的物体,当光线穿过它时,会显示出立方体贴图中定义的折射效果。这对于创建逼真的3D场景非常有用,尤其是那些需要展示透明或半透明物体的场景。
告诉Three.js引擎使用立方体贴图来计算折射效果。折射是指光线从一种介质进入另一种介质时速度发生改变,导致光线方向发生偏转的现象。在3D图形中,折射效果可以用来模拟水、玻璃等透明物质的效果。