Assignment 7

Due 11/10

usually between 0 and 1 for x,y,z

usually point away from the outside of a surface

Normals

used for Material

used for Lighting

used for Shading

Normals

V1

V2

V3

V4

V6

V5

(x, y, z)

(x, y, z)

(x, y, z)

(x, y, z)

(x, y, z)

(x, y, z)

Vertex

/ Vertices

Face

Face

N1 (x, y, z)

N2 (x, y, z)

Face

Normals

V1

V2

V3

V4

V6

V5

(x, y, z)

(x, y, z)

(x, y, z)

(x, y, z)

(x, y, z)

(x, y, z)

Vertex

/ Vertices

Face

Face

N1 (x, y, z)

N2 (x, y, z)

Vertex

N3 (x, y, z)

N6 (x, y, z)

N5 (x, y, z)

N4 (x, y, z)

No Shading

Normals

used for Material

used for Lighting

No Normals

Face Normals

Vertex Normals

V1

V2

V3

Bump Map

Normals

Pixel

  var geometry = new THREE.BoxBufferGeometry( 20, 20, 20);
  var material = new THREE.MeshStandardMaterial({ color: 0xffffff });
  var mesh = new THREE.Mesh( geometry, material);

Mesh File Formats

GLTF

.gltf

.glb

STL

OBJ

PLY

Collada

.dae

.stl

.ply

.obj

And more:

Stereo Lithography (STL)

solid SOMENAME
   facet normal 1 0 0
      outer loop
         vertex 0 0 1
         vertex 1 0 0
         vertex 0 1 0
      endloop
   endfacet
   facet normal 1 0 0
      outer loop
         vertex 0 0 1
         vertex 1 1 0
         vertex 1 1 1
      endloop
   endfacet
   ...
endsolid

Face 1

Face 2

Stanford Polygon File (PLY)

ply
format ascii 1.0          
comment i love cs460
element vertex 4       
property float x          
property float y         
property float z      
element face 3
property list uchar int vertex_index 
end_header                 
0 0 0                      
0 0 1
0 1 1
0 1 0
3 0 1 2 
3 1 2 3
3 1 2 4

Vertices

Faces

Header

Wavefront Object (OBJ)

Vertices

Faces

v -0.5 -0.5 0.5
v 0.5 -0.5 0.5
v -0.5 0.5 0.5
v 0.5 0.5 0.5
v -0.5 0.5 -0.5
v 0.5 0.5 -0.5
v -0.5 -0.5 -0.5
v 0.5 -0.5 -0.5
f 1 2 4
f 1 4 3
f 3 4 6
f 3 6 5
f 5 6 8
f 5 8 7
f 7 8 2
f 7 2 1
f 2 8 6
f 2 6 4
f 7 1 3
f 7 3 8
f 7 3 5

Let's make an OBJ file

What about Three.js?

Lecture 26

By Daniel Haehn

Lecture 26

Slides for CS460 Computer Graphics at UMass Boston. See https://cs460.org!

  • 107

More from Daniel Haehn