three+objloader打造爱心歌单效果-html代码-BFW代码库

three+objloader打造爱心歌单效果

代码语言：html

所属分类：三维

代码描述：three+objloader打造爱心歌单效果

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
html, body {
  overflow: hidden;
}
</style>

</head>
<body translate="no">

<script id="vertexShader" type="x-shader/x-vertex">
uniform float mRefractionRatio;
uniform float mFresnelBias;
uniform float mFresnelScale;
uniform float mFresnelPower;

varying vec3 vReflect;
varying vec3 vRefract[3];
varying float vReflectionFactor;

varying vec2 f_uv;
varying vec3 f_normal;
varying vec3 f_position;
void main() {
	f_uv = uv;
	f_normal = normalize( normalMatrix * normal );
	f_position = position;
	
	vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
	vec4 worldPosition = modelMatrix * vec4( position, 1.0 );
	
	vec3 worldNormal = normalize( mat3( modelMatrix[0].xyz, modelMatrix[1].xyz, modelMatrix[2].xyz ) * normal );
	
	vec3 I = worldPosition.xyz - cameraPosition;
	
	vReflect = reflect( I, worldNormal );
	vRefract[0] = refract( normalize( I ), worldNormal, mRefractionRatio );
	vRefract[1] = refract( normalize( I ), worldNormal, mRefractionRatio * 0.99 );
	vRefract[2] = refract( normalize( I ), worldNormal, mRefractionRatio * 0.98 );
	vReflectionFactor = mFresnelBias + mFresnelScale * pow( 1.0 + dot( normalize( I ), worldNormal ), mFresnelPower );
	
	gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
}
</script>
<script id="fragmentShader" type="x-shader/x-fragment">
uniform samplerCube tCube;

varying vec3 vReflect;
varying vec3 vRefract[3];
varying float vReflectionFactor;
	
uniform sampler2D texture;
uniform int u_useTexture;
uniform vec3 u_albedo;
uniform vec3 u_ambient;
uniform vec3 u_lightPos;
uniform vec3 u_lightCol;
uniform float u_lightIntensity;
uniform vec3 CamPos;

varying vec3 f_position;
varying vec3 f_normal;
varying vec2 f_uv;

void main() {
	vec4 color = vec4(u_albedo, 1.0);
	
	if (u_useTexture == 1) {
		color = texture2D(texture, f_uv);
	}
	float d = clamp(dot(f_normal, normalize(u_lightPos - f_position)), 0.0, 1.0);
	float t = clamp(dot(f_normal, normalize(CamPos - f_position)), 0.0, 1.0);
	
	float red = 0.5 + 0.5*(cos(6.28*(t)));
	float green = 0.5 + 0.5*(cos(6.28*(t+0.33)));
	float blue = 0.5 + 0.5*(cos(6.28*(t+0.67)));
	
	vec3 iridescent_color = vec3(red, green, blue);
	
	vec4 reflectedColor = textureCube( tCube, vec3( -vReflect.x, vReflect.yz ) );
	vec4 refractedColor = vec4( 1.0 );
	
	refractedColor.r = mix(textureCube( tCube, vec3( -vRefract[0].x, vRefract[0].yz ) ).r, red, 0.8);
	refractedColor.g = mix(textureCube( tCube, vec3( -vRefract[1].x, vRefract[1].yz ) ).g, green, 0.8);
	refractedColor.b = mix(textureCube( tCube, vec3( -vRefract[2].x, vRefract[2].yz ) ).b, blue, 0.8);
	gl_FragColor = mix( refractedColor, reflectedColor, clamp( vReflectionFactor, 0.0, 1.0 ) );
}
</script>

<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/three.109.js"></script>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/OBJLoader-min.js"></script>
<script >
var container;
var camera, scene, renderer, textureCube, object;
var mouseX = 0,mouseY = 0;
var clock = new THREE.Clock();
var path = 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/253981/';
var format = ".png";
var order = ["sky", "sky", "sky", "sky", "cov", &quo.........完整代码请登录后点击上方下载按钮下载查看