blob: a9c9c5bca7c8a8f8947d7af96a928725df92c5ab (
plain)
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
|
<script src="./rigidbody_3/dist/output.js"></script>
<script>
window.onload = function() {
var lPlayElement = document.getElementById('gl_canvas_play'),
lStopElement = document.getElementById('gl_canvas_stop');
lPlayElement.addEventListener('click', function() {
lPlayElement.style.display = 'none';
lStopElement.style.display = 'block';
});
lStopElement.addEventListener('click', function() {
lStopElement.style.display = 'none';
lPlayElement.style.display = 'block';
});
}
</script>
<article>
<h1>Rigidbody #3: Collision Response</h1>
<p>
Now that we have our objects flying and spinning around the scene according to the laws of physics, let's see what happens when two of these objects collide with one another. Please note that this section is <b>not</b> about how we <i>find</i> those collisions, but rather how we <i>resolve</i> those collisions. The links under the "Collision" section on the left pane contain different algorithms on how you can find these collisions.
<br/><br/>
As always, I recommend reading <a href='http://www.chrishecker.com/images/e/e7/Gdmphys3.pdf'>Chris Hecker's explanation</a> of this particular topic if you want more in-depth information.
</p>
<section>
<h2></h2>
</section>
<section>
<h2>
Live Example
</h2>
<p>
I didn't put any user interaction into this demo yet. This is live however. You can watch as two circles collide with one another.
</p>
<div class="opengl_canvas_container">
<canvas id="gl_canvas" width="800" height="600"></canvas>
<button id="gl_canvas_play" class="play_button">
Play
</button>
<button id="gl_canvas_stop" class="stop_button">
Stop
</button>
</div>
<footer id="references">
<h2>References</h2>
<ul>
<li><a href="https://en.wikipedia.org/wiki/List_of_moments_of_inertia">Moment of Inertia of Plate (which we use for a rectangle)</a></li>
</ul>
</footer>
</section>
</article>
|
