-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
95 lines (94 loc) · 8.85 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="icon" href="/favicon.ico" type="image/x-icon">
<title>Computer Graphics Demos / Examples</title>
</head>
<body>
<h1>CSCI 331: Computer Graphics @ Moravian University - Spring 2023</h1>
<p>This is the repository for all of the demos and examples from the
class. Feel free to look at these and copy from these in any of your
projects. The list will be updated continuously throughout the semester
so make sure you keep pulling the updates.</p>
<ol>
<li value=0>First day demos<ul>
<li><a href="0-Day-1/first.html">First WebGL Program</a></li>
<li><a href="0-Day-1/first-copy.html">First WebGL Program (copy for you to edit)</a></li>
</ul></li>
<li value=2>Rendering<ul>
<li><a href="2-Rendering/trapezoid.html">Trapezoid</a> - <a href="2-Rendering/trapezoid-solution.html">solution</a> - <a href="2-Rendering/trapezoid-solution-cleanup.html">solution cleaned up</a></li>
<li><a href="2-Rendering/trapezoid-vao.html">Trapezoid using VAO</a> - <a href="2-Rendering/trapezoid-vao-solution.html">solution</a></li>
<li><a href="2-Rendering/maxwell.html">Maxwell's Triangle</a> - <a href="2-Rendering/maxwell-solution.html">solution</a> - <a href="2-Rendering/maxwell-solution-ibo.html">solution w/ IBO</a></li>
<li><a href="2-Rendering/sierpinski.html">Sierpinski's Triangle</a> - <a href="2-Rendering/sierpinski-solution.html">solution</a></li>
<li><a href="2-Rendering/sierpinski-color.html">Sierpinski's Triangle in Color</a> - <a href="2-Rendering/sierpinski-color-solution.html">solution</a></li>
<li><a href="2-Rendering/rectangle.html">Rectangle</a> - <a href="2-Rendering/rectangle-solution.html">solution</a></li>
<li><a href="2-Rendering/rectangle-strip.html">Rectangle using Triangle Strip</a> - <a href="2-Rendering/rectangle-strip-solution.html">solution</a></li>
<li><a href="2-Rendering/rectangle-fan.html">Rectangle using Triangle Fan</a> - <a href="2-Rendering/rectangle-fan-solution.html">solution</a></li>
<li><a href="2-Rendering/circle.html">Circle</a> - <a href="2-Rendering/circle-solution.html">solution</a></li>
<li><a href="2-Rendering/circle-better.html">Circle Better</a> - <a href="2-Rendering/circle-better-solution.html">solution</a></li>
<li><a href="2-Rendering/circle-resize.html">Resizable Circle</a> - <a href="2-Rendering/circle-resize-solution.html">solution</a>
- <a href="2-Rendering/circle-resize-a-slider-solution.html">+slider</a>
- <a href="2-Rendering/circle-resize-b-winresize-solution.html">+window resize</a>
- <a href="2-Rendering/circle-resize-c-drag-solution.html">+dragging</a>
- <a href="2-Rendering/circle-resize-d-wheel-solution.html">+wheel</a>
- <a href="2-Rendering/circle-resize-e-keys-solution.html">+keys</a></li>
<li><a href="2-Rendering/tetrahedron.html">Tetrahedron</a> - <a href="2-Rendering/tetrahedron-solution.html">solution</a></li>
<li><a href="2-Rendering/promises.html">Promises Demo</a> - <a href="2-Rendering/promises2.html">Promises 2 Demo</a></li>
<li><a href="2-Rendering/model-loading.html">Model Loading</a> - <a href="2-Rendering/model-loading-solution.html">solution</a></li>
<li><a href="2-Rendering/car.html">Car</a> - <a href="2-Rendering/car-solution.html">solution</a></li>
</ul></li>
<li>Lighting<ul>
<li><a href="3-Lighting/maxwell.html">Maxwell's Triangle</a> - <a href="3-Lighting/maxwell-solution.html">solution</a></li>
<li><a href="3-Lighting/solid-triangle.html">Solid Color Triangle</a> - <a href="3-Lighting/solid-triangle-solution.html">solution</a></li>
<li><a href="3-Lighting/tessellation-twist.html">Tessellation with a Twist</a> - <a href="3-Lighting/tessellation-twist-solution.html">solution</a></li>
<li><a href="3-Lighting/tessellation-twist-click.html">Tessellation with a Twist and a Click</a> - <a href="3-Lighting/tessellation-twist-click-solution.html">solution</a></li>
<li><a href="3-Lighting/birds.html">Birds</a> - <a href="3-Lighting/birds-solution.html">solution</a></li>
<li><a href="3-Lighting/phong.html">Phong Lighting</a> - <a href="3-Lighting/phong-solution.html">solution</a></li>
<li><a href="3-Lighting/teapot.html">Teapot</a> - <a href="3-Lighting/teapot-solution.html">solution</a></li>
</ul></li>
<li>Cameras<ul>
<li><a href="4-Cameras/translation.html">Translation</a> - <a href="4-Cameras/translation-solution.html">solution</a></li>
<li><a href="4-Cameras/rotation-xyz.html">Rotation XYZ</a> - <a href="4-Cameras/rotation-xyz-solution.html">solution</a></li>
<li><a href="4-Cameras/rotation-axis.html">Rotation around Axis</a> - <a href="4-Cameras/rotation-axis-solution.html">solution</a></li>
<li><a href="4-Cameras/scaling.html">Scaling</a> - <a href="4-Cameras/scaling-solution.html">solution</a></li>
<li><a href="4-Cameras/rotation-translation.html">Rotation & Translation</a> - <a href="4-Cameras/rotation-translation-solution.html">solution</a></li>
<li><a href="4-Cameras/transformation-solution.html">Complete Transformation Demo</a></li>
<li><a href="4-Cameras/orthographic.html">Orthographic</a> - <a href="4-Cameras/orthographic-solution.html">solution</a></li>
<li><a href="4-Cameras/orthographic2.html">Orthographic (that maintains aspect ratio)</a> - <a href="4-Cameras/orthographic2-solution.html">solution</a></li>
<li><a href="4-Cameras/perspective.html">Perspective</a> - <a href="4-Cameras/perspective-solution.html">solution</a></li>
<li><a href="4-Cameras/lookat.html">Look-At</a> - <a href="4-Cameras/lookat-solution.html">solution</a></li>
</ul></li>
<li>Animation<ul>
<li><a href="5-Animation/animation.html">Animation</a> - <a href="5-Animation/animation-solution.html">solution</a></li>
<li><a href="5-Animation/variable-animation.html">Variable Animation</a> - <a href="5-Animation/variable-animation-solution.html">solution</a></li>
<li><a href="5-Animation/mouse-events.html">Mouse Events</a> - <a href="5-Animation/mouse-events-solution.html">solution</a></li>
<li><a href="5-Animation/robot-arm.html">Robot Arm</a> - <a href="5-Animation/robot-arm-solution.html">solution</a></li>
<li><a href="5-Animation/robot-multi-arm.html">Multiple Robot Arms</a> - <a href="5-Animation/robot-multi-arm-solution.html">solution</a></li>
<li><a href="5-Animation/person.html">Person</a></li>
</ul></li>
<li>Blending<ul>
<li><a href="6-Blending/blending.html">Blending</a> - <a href="6-Blending/blending-solution.html">solution</a></li>
<li><a href="6-Blending/blending-ordered.html">Blending with Ordering</a> - <a href="6-Blending/blending-ordered-solution.html">solution</a></li>
</ul></li>
<li>Textures<ul>
<li><a href="7-Textures/texture-basic.html">Basic Textures</a> - <a href="7-Textures/texture-basic-solution.html">solution</a></li>
<li><a href="7-Textures/texture-image.html">Image Textures</a> - <a href="7-Textures/texture-image-solution.html">solution</a></li>
<li><a href="7-Textures/multitexture-user-selectable.html">Multiple Textures (user-selectable)</a> - <a href="7-Textures/multitexture-user-selectable-solution.html">solution</a></li>
<li><a href="7-Textures/parameters.html">Parameters Exploration</a></li>
<li><a href="7-Textures/multitexture-combined.html">Multiple Textures (combined)</a> - <a href="7-Textures/multitexture-combined-solution.html">solution</a></li>
<li><a href="7-Textures/multitexture-side-by-side.html">Multiple Textures (side-by-side)</a> - <a href="7-Textures/multitexture-side-by-side-solution.html">solution</a></li>
<li><a href="7-Textures/multiple-images.html">Multiple Images</a> - <a href="7-Textures/multiple-images-solution.html">solution</a></li>
<li><a href="7-Textures/cubemap.html">Cubemap</a> - <a href="7-Textures/cubemap-solution.html">solution</a></li>
</ul></li>
</ol>
<h2>Examples:</h2>
<ul>
<li><a href="examples/sphere.html">Sphere</a></li>
</ul>
<h2>Tools:</h2>
<ul>
<li><a href="obj2json.html">Convert OBJ to JSON</a></li>
</ul>
</body>
</html>