Monday 11/6
Monday 11/13
Travel 11/8-11/10
Friday 11/17
Wednesday 11/29
Manuel Sainsily
Dan Ginsburg
Paloma Gonzalez-Rojas, Jose T. Dominguez
atacama.bio/3dprinting
+
3D model
Assignment 5
Bonus
Spandan Madan
11 / 16 / 2022
Dan Ginsburg
11 / 28
Vulkan, OpenGL, and OpenGL ES renderers for the Source 2 engine used by games such as Dota 2, Artifact, and Dota Underlords
Assignment 8
Assignment 8
Due 11/21!
Normals
V4
V6
V5
(x, y, z)
(x, y, z)
(x, y, z)
Face
N4 (x, y, z)
V1
V3
(x, y, z)
(x, y, z)
(x, y, z)
Vertex
/ Vertices
Face
N1 (x, y, z)
N2 (x, y, z)
N3 (x, y, z)
Vertex Normals
Face Normals
used for Material
used for Lighting
used for Shading
V1
V2
V3
Bump Map
Normals
Pixel
Mesh File Formats
GLTF
.gltf
.glb
STL
OBJ
PLY
Collada
.dae
.stl
.ply
.obj
And more:
Let's make an OBJ file
v 0 0 0
v 0 10 0
v 10 0 0
v 0 0 10
f 1 2 3
f 1 2 4
f 1 4 3
f 2 4 3
save as tetrahedron.obj and drag into Slicedrop.com
+
Assignment 5
Now let's load some PLY file!
<html>
<head>
<meta charset="UTF-8" />
<style>
html, body {
background-color:#000;
margin: 0;
padding: 0;
height: 100%;
overflow: hidden !important;
}
</style>
<script src="https://threejs.org/build/three.min.js" type="text/javascript"></script>
<script src="https://threejs.org/examples/js/controls/TrackballControls.js" type="text/javascript"></script>
<script src="https://threejs.org/examples/js/loaders/PLYLoader.js" type="text/javascript"></script>
<script>
var scene, camera, renderer, ambientLight, light, controls;
var floor;
window.onload = function() {
scene = new THREE.Scene();
var fov = 60;
var ratio = window.innerWidth / window.innerHeight;
var zNear = 1;
var zFar = 10000;
camera = new THREE.PerspectiveCamera(fov, ratio, zNear, zFar);
camera.position.set( 0, 0, 500);
renderer = new THREE.WebGLRenderer({ alpha: true });
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
ambientLight = new THREE.AmbientLight();
scene.add( ambientLight );
light = new THREE.DirectionalLight( 0xffffff, 5.0 );
light.position.set( 10, 100, 10 );
scene.add( light );
controls = new THREE.TrackballControls( camera, renderer.domElement );
// TODO
animate();
};
function animate() {
requestAnimationFrame( animate );
controls.update();
renderer.render( scene, camera );
};
</script>
</head>
<body></body>
</html>
var loader = new PLYLoader();
loader.load('beethoven.ply', function (geometry) {
geometry.computeVertexNormals();
var material = new THREE.MeshStandardMaterial( {
color: 'red'
} );
scene.add( new THREE.Mesh( geometry, material ) );
} );
+
Assignment 5
var loader = new THREE.PLYLoader();
loader.load('beethoven.ply', function (geometry) {
geometry.computeVertexNormals();
var material = new THREE.MeshStandardMaterial( {
color: 'red'
} );
scene.add( new THREE.Mesh( geometry, material ) );
} );
Constructive Solid Geometry
Quiz today!