Skip to content

T
three.js

Ablesons / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

体验新版 GitCode，发现更多精彩内容 >>

提交 802143c5 编写于 作者: M Mr.doob
浏览文件
操作

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

上级 22f3718d 61142563
隐藏空白更改
内联 并排
Showing with 78 addition and 16 deletion
examples/webgl_materials_texture_compressed.html
浏览文件 @ 802143c5
......@@ -7,18 +7,43 @@
body {
margin: 0px;
background-color: #050505;
color: #fff;
overflow: hidden;
}
a { color: #e00 }
#info {
position: absolute;
top: 0px; width: 100%;
color: #ffffff;
padding: 5px;
font-family:Monospace;
font-size:13px;
text-align:center;
z-index:1000;
}
</style>
</head>
<body>
<div id="info">
<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl - compressed textures -
leaf texture by <a href="http://opengameart.org/node/10505">lauris71</a>, explosion texture by <a href="http://opengameart.org/node/7728">bart</a>
</div>
<script src="../build/three.min.js"></script>
<script src="js/Detector.js"></script>
<script src="js/Stats.js"></script>
<script>
if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
var camera, scene, renderer;
var mesh1, mesh2;
var meshes = [];
init();
animate();
......@@ -26,7 +51,7 @@
function init() {
camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 2000 );
camera.position.z = 800;
camera.position.z = 1000;
scene = new THREE.Scene();
......@@ -39,21 +64,55 @@
var map2 = THREE.ImageUtils.loadCompressedTexture( 'textures/compressed/disturb_dxt1_mip.dds' );
map2.anisotropy = 4;
var material1 = new THREE.MeshBasicMaterial( { map: map1 } );
var material2 = new THREE.MeshBasicMaterial( { map: map2 } );
mesh1 = new THREE.Mesh( geometry, material1 );
mesh1.position.x = -200;
scene.add( mesh1 );
var map3 = THREE.ImageUtils.loadCompressedTexture( 'textures/compressed/hepatica_dxt3_mip.dds' );
map3.anisotropy = 4;
mesh2 = new THREE.Mesh( geometry, material2 );
mesh2.position.x = 200;
scene.add( mesh2 );
var map4 = THREE.ImageUtils.loadCompressedTexture( 'textures/compressed/explosion_dxt5_mip.dds' );
map4.anisotropy = 4;
renderer = new THREE.WebGLRenderer();
var material1 = new THREE.MeshBasicMaterial( { map: map1 } );
var material2 = new THREE.MeshBasicMaterial( { map: map2 } );
var material3 = new THREE.MeshBasicMaterial( { map: map3, alphaTest: 0.5, side: THREE.DoubleSide } );
var material4 = new THREE.MeshBasicMaterial( { map: map4, side: THREE.DoubleSide, blending: THREE.AdditiveBlending, depthTest: false, transparent: true } );
var mesh = new THREE.Mesh( geometry, material1 );
mesh.position.x = -200;
mesh.position.y = -200;
scene.add( mesh );
meshes.push( mesh );
mesh = new THREE.Mesh( geometry, material2 );
mesh.position.x = 200;
mesh.position.y = -200;
scene.add( mesh );
meshes.push( mesh );
mesh = new THREE.Mesh( geometry, material3 );
mesh.position.x = 200;
mesh.position.y = 200;
scene.add( mesh );
meshes.push( mesh );
mesh = new THREE.Mesh( geometry, material4 );
mesh.position.x = -200;
mesh.position.y = 200;
scene.add( mesh );
meshes.push( mesh );
renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
stats = new Stats();
stats.domElement.style.position = 'absolute';
stats.domElement.style.top = '0px';
stats.domElement.style.zIndex = 100;
document.body.appendChild( stats.domElement );
stats.domElement.children[ 0 ].children[ 0 ].style.color = "#777";
stats.domElement.children[ 0 ].style.background = "transparent";
stats.domElement.children[ 0 ].children[ 1 ].style.display = "none";
window.addEventListener( 'resize', onWindowResize, false );
}
......@@ -73,13 +132,16 @@
var time = Date.now() * 0.001;
mesh1.rotation.x = time;
mesh1.rotation.y = time;
for ( var i = 0; i < meshes.length; i ++ ) {
var mesh = meshes[ i ];
mesh.rotation.x = time;
mesh.rotation.y = time;
mesh2.rotation.x = time;
mesh2.rotation.y = time;
}
renderer.render( scene, camera );
stats.update();
}
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或