Skip to content

Commit

Permalink
Improved minecraft examples. Using atlas instead of MeshFaceMaterial.
Browse files Browse the repository at this point in the history 
It's still being rendered in 2 drawcalls though (big geometry).
  • Loading branch information
@mrdoob
mrdoob committed Mar 31, 2013
1 parent 51d5974 commit 8934c44
Show file tree
Hide file tree
Showing 4 changed files with 43 additions and 48 deletions.
Binary file added examples/textures/minecraft/atlas.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
30 changes: 14 additions & 16 deletions examples/webgl_geometry_minecraft.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,26 +93,31 @@
var matrix = new THREE.Matrix4();

var pxGeometry = new THREE.PlaneGeometry( 100, 100 );
pxGeometry.faces[ 0 ].materialIndex = 1;
pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
pxGeometry.applyMatrix( matrix.makeRotationY( Math.PI / 2 ) );
pxGeometry.applyMatrix( matrix.makeTranslation( 50, 0, 0 ) );

var nxGeometry = new THREE.PlaneGeometry( 100, 100 );
nxGeometry.faces[ 0 ].materialIndex = 1;
nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
nxGeometry.applyMatrix( matrix.makeRotationY( - Math.PI / 2 ) );
nxGeometry.applyMatrix( matrix.makeTranslation( - 50, 0, 0 ) );

var pyGeometry = new THREE.PlaneGeometry( 100, 100 );
pyGeometry.faces[ 0 ].materialIndex = 0;
pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 1 ].y = 0.5;
pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 2 ].y = 0.5;
pyGeometry.applyMatrix( matrix.makeRotationX( - Math.PI / 2 ) );
pyGeometry.applyMatrix( matrix.makeTranslation( 0, 50, 0 ) );

var pzGeometry = new THREE.PlaneGeometry( 100, 100 );
pzGeometry.faces[ 0 ].materialIndex = 1;
pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
pzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, 50 ) );

var nzGeometry = new THREE.PlaneGeometry( 100, 100 );
nzGeometry.faces[ 0 ].materialIndex = 1;
nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
nzGeometry.applyMatrix( matrix.makeRotationY( Math.PI ) );
nzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, -50 ) );
//
Expand Down Expand Up @@ -170,18 +175,11 @@

}

var textureGrass = THREE.ImageUtils.loadTexture( 'textures/minecraft/grass.png' );
textureGrass.magFilter = THREE.NearestFilter;
textureGrass.minFilter = THREE.LinearMipMapLinearFilter;
var texture = THREE.ImageUtils.loadTexture( 'textures/minecraft/atlas.png' );
texture.magFilter = THREE.NearestFilter;
texture.minFilter = THREE.LinearMipMapLinearFilter;

var textureGrassDirt = THREE.ImageUtils.loadTexture( 'textures/minecraft/grass_dirt.png' );
textureGrassDirt.magFilter = THREE.NearestFilter;
textureGrassDirt.minFilter = THREE.LinearMipMapLinearFilter;

var material1 = new THREE.MeshLambertMaterial( { map: textureGrass, ambient: 0xbbbbbb } );
var material2 = new THREE.MeshLambertMaterial( { map: textureGrassDirt, ambient: 0xbbbbbb } );

var mesh = new THREE.Mesh( geometry, new THREE.MeshFaceMaterial( [ material1, material2 ] ) );
var mesh = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { map: texture, ambient: 0xbbbbbb } ) );
scene.add( mesh );

var ambientLight = new THREE.AmbientLight( 0xcccccc );
Expand Down
30 changes: 14 additions & 16 deletions examples/webgl_geometry_minecraft_ao.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -103,31 +103,36 @@
var matrix = new THREE.Matrix4();

var pxGeometry = new THREE.PlaneGeometry( 100, 100 );
pxGeometry.faces[ 0 ].materialIndex = 1;
pxGeometry.faces[ 0 ].vertexColors = [ light, shadow, shadow, light ];
pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
pxGeometry.applyMatrix( matrix.makeRotationY( Math.PI / 2 ) );
pxGeometry.applyMatrix( matrix.makeTranslation( 50, 0, 0 ) );

var nxGeometry = new THREE.PlaneGeometry( 100, 100 );
nxGeometry.faces[ 0 ].materialIndex = 1;
nxGeometry.faces[ 0 ].vertexColors = [ light, shadow, shadow, light ];
nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
nxGeometry.applyMatrix( matrix.makeRotationY( - Math.PI / 2 ) );
nxGeometry.applyMatrix( matrix.makeTranslation( - 50, 0, 0 ) );

var pyGeometry = new THREE.PlaneGeometry( 100, 100 );
pyGeometry.faces[ 0 ].materialIndex = 0;
pyGeometry.faces[ 0 ].vertexColors = [ light, light, light, light ];
pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 1 ].y = 0.5;
pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 2 ].y = 0.5;
pyGeometry.applyMatrix( matrix.makeRotationX( - Math.PI / 2 ) );
pyGeometry.applyMatrix( matrix.makeTranslation( 0, 50, 0 ) );

var pzGeometry = new THREE.PlaneGeometry( 100, 100 );
pzGeometry.faces[ 0 ].materialIndex = 1;
pzGeometry.faces[ 0 ].vertexColors = [ light, shadow, shadow, light ];
pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
pzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, 50 ) );

var nzGeometry = new THREE.PlaneGeometry( 100, 100 );
nzGeometry.faces[ 0 ].materialIndex = 1;
nzGeometry.faces[ 0 ].vertexColors = [ light, shadow, shadow, light ];
nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
nzGeometry.applyMatrix( matrix.makeRotationY( Math.PI ) );
nzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, -50 ) );

Expand Down Expand Up @@ -218,18 +223,11 @@

}

var textureGrass = THREE.ImageUtils.loadTexture( 'textures/minecraft/grass.png' );
textureGrass.magFilter = THREE.NearestFilter;
textureGrass.minFilter = THREE.LinearMipMapLinearFilter;
var texture = THREE.ImageUtils.loadTexture( 'textures/minecraft/atlas.png' );
texture.magFilter = THREE.NearestFilter;
texture.minFilter = THREE.LinearMipMapLinearFilter;

var textureGrassDirt = THREE.ImageUtils.loadTexture( 'textures/minecraft/grass_dirt.png' );
textureGrassDirt.magFilter = THREE.NearestFilter;
textureGrassDirt.minFilter = THREE.LinearMipMapLinearFilter;

var material1 = new THREE.MeshLambertMaterial( { map: textureGrass, ambient: 0xbbbbbb, vertexColors: THREE.VertexColors } );
var material2 = new THREE.MeshLambertMaterial( { map: textureGrassDirt, ambient: 0xbbbbbb, vertexColors: THREE.VertexColors } );

var mesh = new THREE.Mesh( geometry, new THREE.MeshFaceMaterial( [ material1, material2 ] ) );
var mesh = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { map: texture, ambient: 0xbbbbbb, vertexColors: THREE.VertexColors } ) );
scene.add( mesh );

var ambientLight = new THREE.AmbientLight( 0xcccccc );
Expand Down
31 changes: 15 additions & 16 deletions examples/webgl_geometry_minecraft_oculusrift.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -94,28 +94,34 @@
var matrix = new THREE.Matrix4();

var pxGeometry = new THREE.PlaneGeometry( 100, 100 );
pxGeometry.faces[ 0 ].materialIndex = 1;
pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
pxGeometry.applyMatrix( matrix.makeRotationY( Math.PI / 2 ) );
pxGeometry.applyMatrix( matrix.makeTranslation( 50, 0, 0 ) );

var nxGeometry = new THREE.PlaneGeometry( 100, 100 );
nxGeometry.faces[ 0 ].materialIndex = 1;
nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
nxGeometry.applyMatrix( matrix.makeRotationY( - Math.PI / 2 ) );
nxGeometry.applyMatrix( matrix.makeTranslation( - 50, 0, 0 ) );

var pyGeometry = new THREE.PlaneGeometry( 100, 100 );
pyGeometry.faces[ 0 ].materialIndex = 0;
pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 1 ].y = 0.5;
pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 2 ].y = 0.5;
pyGeometry.applyMatrix( matrix.makeRotationX( - Math.PI / 2 ) );
pyGeometry.applyMatrix( matrix.makeTranslation( 0, 50, 0 ) );

var pzGeometry = new THREE.PlaneGeometry( 100, 100 );
pzGeometry.faces[ 0 ].materialIndex = 1;
pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
pzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, 50 ) );

var nzGeometry = new THREE.PlaneGeometry( 100, 100 );
nzGeometry.faces[ 0 ].materialIndex = 1;
nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
nzGeometry.applyMatrix( matrix.makeRotationY( Math.PI ) );
nzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, -50 ) );

//

var geometry = new THREE.Geometry();
Expand Down Expand Up @@ -171,18 +177,11 @@

}

var textureGrass = THREE.ImageUtils.loadTexture( 'textures/minecraft/grass.png' );
textureGrass.magFilter = THREE.NearestFilter;
textureGrass.minFilter = THREE.LinearMipMapLinearFilter;

var textureGrassDirt = THREE.ImageUtils.loadTexture( 'textures/minecraft/grass_dirt.png' );
textureGrassDirt.magFilter = THREE.NearestFilter;
textureGrassDirt.minFilter = THREE.LinearMipMapLinearFilter;

var material1 = new THREE.MeshLambertMaterial( { map: textureGrass, ambient: 0xbbbbbb } );
var material2 = new THREE.MeshLambertMaterial( { map: textureGrassDirt, ambient: 0xbbbbbb } );
var texture = THREE.ImageUtils.loadTexture( 'textures/minecraft/atlas.png' );
texture.magFilter = THREE.NearestFilter;
texture.minFilter = THREE.LinearMipMapLinearFilter;

var mesh = new THREE.Mesh( geometry, new THREE.MeshFaceMaterial( [ material1, material2 ] ) );
var mesh = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { map: texture, ambient: 0xbbbbbb } ) );
scene.add( mesh );

var ambientLight = new THREE.AmbientLight( 0xcccccc );
Expand Down

0 comments on commit 8934c44

Please sign in to comment.