提交 01a15e24 编写于 作者: M Mr.doob

Merge remote-tracking branch 'alteredq/dev' into dev

此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
因为 它太大了无法显示 source diff 。你可以改为 查看blob
<!doctype html>
<html lang="en">
<head>
<title>three.js webgl - performance</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<style>
body {
background:#fff;
padding:0;
margin:0;
font-weight: bold;
overflow:hidden;
}
</style>
</head>
<body>
<script src="../build/Three.js"></script>
<script src="js/Detector.js"></script>
<script src="js/Stats.js"></script>
<script>
if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
var container, stats;
var camera, scene, renderer;
var mesh, geometry;
var mouseX = 0, mouseY = 0;
var SCREEN_WIDTH = window.innerWidth,
SCREEN_HEIGHT = window.innerHeight;
var windowHalfX = SCREEN_WIDTH / 2;
var windowHalfY = SCREEN_HEIGHT / 2;
var FANCY = true;
init();
animate();
function init() {
container = document.createElement( 'div' );
document.body.appendChild( container );
camera = new THREE.PerspectiveCamera( 50, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 20000 );
camera.position.z = 3200;
scene = new THREE.Scene();
scene.add( camera );
var light = new THREE.PointLight( 0x0011ff, 1, 5500 );
light.position.set( 4000, 0, 0 );
scene.add( light );
var light = new THREE.PointLight( 0xff1100, 1, 5500 );
light.position.set( -4000, 0, 0 );
scene.add( light );
if ( FANCY ) {
var light = new THREE.PointLight( 0xffaa00, 2, 3000 );
light.position.set( 0, 0, 0 );
scene.add( light );
var path = "textures/cube/SwedishRoyalCastle/";
var format = '.jpg';
var urls = [
path + 'px' + format, path + 'nx' + format,
path + 'py' + format, path + 'ny' + format,
path + 'pz' + format, path + 'nz' + format
];
var reflectionCube = THREE.ImageUtils.loadTextureCube( urls );
reflectionCube.format = THREE.RGBFormat;
var material = new THREE.MeshPhongMaterial( { specular: 0xffffff, shininess: 100, envMap: reflectionCube, combine: THREE.MixOperation, reflectivity: 0.1, perPixel: true } );
material.wrapAround = true;
material.wrapRGB.set( 0.5, 0.5, 0.5 );
} else {
var material = new THREE.MeshPhongMaterial( { specular: 0xffffff, shading: THREE.SmoothShading, perPixel: true } );
}
var geometry = new THREE.SphereGeometry( 1, 32, 16, 0, Math.PI );
for ( var i = 0; i < 5000; i ++ ) {
var mesh = new THREE.Mesh( geometry, material );
mesh.position.x = Math.random() * 10000 - 5000;
mesh.position.y = Math.random() * 10000 - 5000;
mesh.position.z = Math.random() * 10000 - 5000;
mesh.rotation.x = Math.random() * 360 * ( Math.PI / 180 );
mesh.rotation.y = Math.random() * 360 * ( Math.PI / 180 );
mesh.scale.x = mesh.scale.y = mesh.scale.z = Math.random() * 50 + 100;
mesh.matrixAutoUpdate = false;
mesh.updateMatrix();
mesh.doubleSided = true;
scene.add( mesh );
}
renderer = new THREE.WebGLRenderer( { clearColor: 0x050505, clearAlpha: 1, antialias: FANCY } );
renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
renderer.sortObjects = false;
renderer.gammaInput = true;
renderer.gammaOutput = true;
renderer.physicallyBasedShading = FANCY;
container.appendChild( renderer.domElement );
stats = new Stats();
stats.domElement.style.position = 'absolute';
stats.domElement.style.top = '0px';
stats.domElement.style.zIndex = 100;
stats.domElement.children[ 0 ].children[ 0 ].style.color = "#eee";
stats.domElement.children[ 0 ].style.background = "transparent";
stats.domElement.children[ 0 ].children[ 1 ].style.display = "none";
container.appendChild( stats.domElement );
document.addEventListener( 'mousemove', onDocumentMouseMove, false );
window.addEventListener( 'resize', onWindowResize, false );
}
//
function onWindowResize( event ) {
SCREEN_WIDTH = window.innerWidth;
SCREEN_HEIGHT = window.innerHeight;
renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
camera.aspect = SCREEN_WIDTH / SCREEN_HEIGHT;
camera.updateProjectionMatrix();
windowHalfX = SCREEN_WIDTH / 2;
windowHalfY = SCREEN_HEIGHT / 2;
}
function onDocumentMouseMove(event) {
mouseX = ( event.clientX - windowHalfX ) * 10;
mouseY = ( event.clientY - windowHalfY ) * 10;
}
//
function animate() {
requestAnimationFrame( animate );
render();
stats.update();
}
function render() {
camera.position.x += ( mouseX - camera.position.x ) * .05;
camera.position.y += ( - mouseY - camera.position.y ) * .05;
camera.lookAt( scene.position );
renderer.render( scene, camera );
}
</script>
</body>
</html>
......@@ -4211,7 +4211,8 @@ THREE.WebGLRenderer = function ( parameters ) {
alphaTest: material.alphaTest,
metal: material.metal,
perPixel: material.perPixel,
wrapAround: material.wrapAround
wrapAround: material.wrapAround,
doubleSided: object && object.doubleSided
};
......@@ -5287,6 +5288,7 @@ THREE.WebGLRenderer = function ( parameters ) {
parameters.morphNormals ? "#define USE_MORPHNORMALS" : "",
parameters.perPixel ? "#define PHONG_PER_PIXEL" : "",
parameters.wrapAround ? "#define WRAP_AROUND" : "",
parameters.doubleSided ? "#define DOUBLE_SIDED" : "",
parameters.shadowMapEnabled ? "#define USE_SHADOWMAP" : "",
parameters.shadowMapSoft ? "#define SHADOWMAP_SOFT" : "",
......@@ -5377,6 +5379,7 @@ THREE.WebGLRenderer = function ( parameters ) {
parameters.metal ? "#define METAL" : "",
parameters.perPixel ? "#define PHONG_PER_PIXEL" : "",
parameters.wrapAround ? "#define WRAP_AROUND" : "",
parameters.doubleSided ? "#define DOUBLE_SIDED" : "",
parameters.shadowMapEnabled ? "#define USE_SHADOWMAP" : "",
parameters.shadowMapSoft ? "#define SHADOWMAP_SOFT" : "",
......
......@@ -74,7 +74,16 @@ THREE.ShaderChunk = {
"#ifdef USE_ENVMAP",
"vec4 cubeColor = textureCube( envMap, vec3( flipEnvMap * vReflect.x, vReflect.yz ) );",
"#ifdef DOUBLE_SIDED",
"float flipNormal = ( -1.0 + 2.0 * float( gl_FrontFacing ) );",
"vec4 cubeColor = textureCube( envMap, flipNormal * vec3( flipEnvMap * vReflect.x, vReflect.yz ) );",
"#else",
"vec4 cubeColor = textureCube( envMap, vec3( flipEnvMap * vReflect.x, vReflect.yz ) );",
"#endif",
"#ifdef GAMMA_INPUT",
......@@ -285,7 +294,13 @@ THREE.ShaderChunk = {
lights_lambert_vertex: [
"vLightWeighting = vec3( 0.0 );",
"vLightFront = vec3( 0.0 );",
"#ifdef DOUBLE_SIDED",
"vLightBack = vec3( 0.0 );",
"#endif",
"transformedNormal = normalize( transformedNormal );",
......@@ -296,20 +311,41 @@ THREE.ShaderChunk = {
"vec4 lDirection = viewMatrix * vec4( directionalLightDirection[ i ], 0.0 );",
"vec3 dirVector = normalize( lDirection.xyz );",
"float dotProduct = dot( transformedNormal, dirVector );",
"vec3 directionalLightWeighting = vec3( max( dotProduct, 0.0 ) );",
"#ifdef DOUBLE_SIDED",
"vec3 directionalLightWeightingBack = vec3( max( -dotProduct, 0.0 ) );",
"#ifdef WRAP_AROUND",
"vec3 directionalLightWeightingHalfBack = vec3( max( -0.5 * dotProduct + 0.5, 0.0 ) );",
"#endif",
"#endif",
"#ifdef WRAP_AROUND",
"float directionalLightWeightingFull = max( dot( transformedNormal, dirVector ), 0.0 );",
"float directionalLightWeightingHalf = max( 0.5 * dot( transformedNormal, dirVector ) + 0.5, 0.0 );",
"vec3 directionalLightWeightingHalf = vec3( max( 0.5 * dotProduct + 0.5, 0.0 ) );",
"directionalLightWeighting = mix( directionalLightWeighting, directionalLightWeightingHalf, wrapRGB );",
"vec3 directionalLightWeighting = mix( vec3( directionalLightWeightingFull ), vec3( directionalLightWeightingHalf ), wrapRGB );",
"#ifdef DOUBLE_SIDED",
"#else",
"directionalLightWeightingBack = mix( directionalLightWeightingBack, directionalLightWeightingHalfBack, wrapRGB );",
"float directionalLightWeighting = max( dot( transformedNormal, dirVector ), 0.0 );",
"#endif",
"#endif",
"vLightWeighting += directionalLightColor[ i ] * directionalLightWeighting;",
"vLightFront += directionalLightColor[ i ] * directionalLightWeighting;",
"#ifdef DOUBLE_SIDED",
"vLightBack += directionalLightColor[ i ] * directionalLightWeightingBack;",
"#endif",
"}",
......@@ -327,27 +363,54 @@ THREE.ShaderChunk = {
"lDistance = 1.0 - min( ( length( lVector ) / pointLightDistance[ i ] ), 1.0 );",
"lVector = normalize( lVector );",
"float dotProduct = dot( transformedNormal, lVector );",
"vec3 pointLightWeighting = vec3( max( dotProduct, 0.0 ) );",
"#ifdef DOUBLE_SIDED",
"vec3 pointLightWeightingBack = vec3( max( -dotProduct, 0.0 ) );",
"#ifdef WRAP_AROUND",
"vec3 pointLightWeightingHalfBack = vec3( max( -0.5 * dotProduct + 0.5, 0.0 ) );",
"#endif",
"#endif",
"#ifdef WRAP_AROUND",
"float pointLightWeightingFull = max( dot( transformedNormal, lVector ), 0.0 );",
"float pointLightWeightingHalf = max( 0.5 * dot( transformedNormal, lVector ) + 0.5, 0.0 );",
"vec3 pointLightWeightingHalf = vec3( max( 0.5 * dotProduct + 0.5, 0.0 ) );",
"pointLightWeighting = mix( pointLightWeighting, pointLightWeightingHalf, wrapRGB );",
"vec3 pointLightWeighting = mix( vec3 ( pointLightWeightingFull ), vec3( pointLightWeightingHalf ), wrapRGB );",
"#ifdef DOUBLE_SIDED",
"#else",
"pointLightWeightingBack = mix( pointLightWeightingBack, pointLightWeightingHalfBack, wrapRGB );",
"float pointLightWeighting = max( dot( transformedNormal, lVector ), 0.0 );",
"#endif",
"#endif",
"vLightWeighting += pointLightColor[ i ] * pointLightWeighting * lDistance;",
"vLightFront += pointLightColor[ i ] * pointLightWeighting * lDistance;",
"#ifdef DOUBLE_SIDED",
"vLightBack += pointLightColor[ i ] * pointLightWeightingBack * lDistance;",
"#endif",
"}",
"#endif",
"vLightWeighting = vLightWeighting * diffuse + ambient * ambientLightColor;",
"vLightFront = vLightFront * diffuse + ambient * ambientLightColor;",
"#ifdef DOUBLE_SIDED",
"vLightBack = vLightBack * diffuse + ambient * ambientLightColor;",
"#endif",
].join("\n"),
......@@ -436,6 +499,12 @@ THREE.ShaderChunk = {
"vec3 normal = normalize( vNormal );",
"vec3 viewPosition = normalize( vViewPosition );",
"#ifdef DOUBLE_SIDED",
"normal = normal * ( -1.0 + 2.0 * float( gl_FrontFacing ) );",
"#endif",
"#if MAX_POINT_LIGHTS > 0",
"vec3 pointDiffuse = vec3( 0.0 );",
......@@ -463,16 +532,18 @@ THREE.ShaderChunk = {
// diffuse
"float dotProduct = dot( normal, lVector );",
"#ifdef WRAP_AROUND",
"float pointDiffuseWeightFull = max( dot( normal, lVector ), 0.0 );",
"float pointDiffuseWeightHalf = max( 0.5 * dot( normal, lVector ) + 0.5, 0.0 );",
"float pointDiffuseWeightFull = max( dotProduct, 0.0 );",
"float pointDiffuseWeightHalf = max( 0.5 * dotProduct + 0.5, 0.0 );",
"vec3 pointDiffuseWeight = mix( vec3 ( pointDiffuseWeightFull ), vec3( pointDiffuseWeightHalf ), wrapRGB );",
"#else",
"float pointDiffuseWeight = max( dot( normal, lVector ), 0.0 );",
"float pointDiffuseWeight = max( dotProduct, 0.0 );",
"#endif",
......@@ -511,16 +582,18 @@ THREE.ShaderChunk = {
// diffuse
"float dotProduct = dot( normal, dirVector );",
"#ifdef WRAP_AROUND",
"float dirDiffuseWeightFull = max( dot( normal, dirVector ), 0.0 );",
"float dirDiffuseWeightHalf = max( 0.5 * dot( normal, dirVector ) + 0.5, 0.0 );",
"float dirDiffuseWeightFull = max( dotProduct, 0.0 );",
"float dirDiffuseWeightHalf = max( 0.5 * dotProduct + 0.5, 0.0 );",
"vec3 dirDiffuseWeight = mix( vec3( dirDiffuseWeightFull ), vec3( dirDiffuseWeightHalf ), wrapRGB );",
"#else",
"float dirDiffuseWeight = max( dot( normal, dirVector ), 0.0 );",
"float dirDiffuseWeight = max( dotProduct, 0.0 );",
"#endif",
......@@ -1321,7 +1394,13 @@ THREE.ShaderLib = {
vertexShader: [
"varying vec3 vLightWeighting;",
"varying vec3 vLightFront;",
"#ifdef DOUBLE_SIDED",
"varying vec3 vLightBack;",
"#endif",
THREE.ShaderChunk[ "map_pars_vertex" ],
THREE.ShaderChunk[ "lightmap_pars_vertex" ],
......@@ -1358,7 +1437,13 @@ THREE.ShaderLib = {
"uniform float opacity;",
"varying vec3 vLightWeighting;",
"varying vec3 vLightFront;",
"#ifdef DOUBLE_SIDED",
"varying vec3 vLightBack;",
"#endif",
THREE.ShaderChunk[ "color_pars_fragment" ],
THREE.ShaderChunk[ "map_pars_fragment" ],
......@@ -1374,7 +1459,21 @@ THREE.ShaderLib = {
THREE.ShaderChunk[ "map_fragment" ],
THREE.ShaderChunk[ "alphatest_fragment" ],
"gl_FragColor.xyz = gl_FragColor.xyz * vLightWeighting;",
"#ifdef DOUBLE_SIDED",
//"float isFront = float( gl_FrontFacing );",
//"gl_FragColor.xyz *= isFront * vLightFront + ( 1.0 - isFront ) * vLightBack;",
"if ( gl_FrontFacing )",
"gl_FragColor.xyz *= vLightFront;",
"else",
"gl_FragColor.xyz *= vLightBack;",
"#else",
"gl_FragColor.xyz *= vLightFront;",
"#endif",
THREE.ShaderChunk[ "lightmap_fragment" ],
THREE.ShaderChunk[ "color_fragment" ],
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册