three实现逼真三维lightmap材质效果代码

代码语言:html

所属分类:三维

代码描述:three实现逼真三维lightmap材质效果代码

代码标签: three 逼真 三维 lightmap 材质

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
       
<head>
       
               
<meta charset="utf-8">
               
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">

       
</head>

       
<body>

               
<script type="x-shader/x-vertex" id="vertexShader">

                        varying vec3 vWorldPosition
;

                       
void main() {

                                vec4 worldPosition
= modelMatrix * vec4( position, 1.0 );
                                vWorldPosition
= worldPosition.xyz;

                                gl_Position
= projectionMatrix * modelViewMatrix * vec4( position, 1.0 );

                       
}

               
</script>

               
<script type="x-shader/x-fragment" id="fragmentShader">

                        uniform vec3 topColor
;
                        uniform vec3 bottomColor
;
                        uniform
float offset;
                        uniform
float exponent;

                        varying vec3 vWorldPosition
;

                       
void main() {

                               
float h = normalize( vWorldPosition + offset ).y;
                                gl_FragColor
= vec4( mix( bottomColor, topColor, max( pow( max( h, 0.0 ), exponent ), 0.0 ) ), 1.0 );

                       
}

               
</script>

               
<!-- Import maps polyfill -->
               
<!-- Remove this when import maps will be widely supported -->
       
<script async type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/es-module-shims.1.3.6.js"></script>


               
<script type="importmap">
                       
{
                               
"imports": {
                                       
"three": "//repo.bfw.wiki/bfwtool/build/three.module.js"
                               
}
                       
}
               
</script>.........完整代码请登录后点击上方下载按钮下载查看

网友评论0