TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Show HN: Minimalistic collisions simulation using TypeScript and HTML Canvas

2 pointsby mike31fr12 months ago
Hey HN,<p>@atan2 submitted a great post 4 days ago about 2D rigid body collisions (<a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=40463764">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=40463764</a>).<p>For what it&#x27;s worth, here is a minimalistic simulation that I coded last year using TypeScript and HTML Canvas:<p>- Code: <a href="https:&#x2F;&#x2F;github.com&#x2F;vandrieu&#x2F;canvas-bouncing-ball">https:&#x2F;&#x2F;github.com&#x2F;vandrieu&#x2F;canvas-bouncing-ball</a><p>- Demo&#x2F;Result: <a href="https:&#x2F;&#x2F;vandrieu.github.io&#x2F;canvas-bouncing-ball" rel="nofollow">https:&#x2F;&#x2F;vandrieu.github.io&#x2F;canvas-bouncing-ball</a><p>The main challenge was how to determine the angle and speed of each ball after a collision at a given angle.<p>I found the relevant theoretical material in the 2009 paper titled &quot;2-Dimensional Elastic Collisions without Trigonometry&quot; by Chad Berchek: <a href="https:&#x2F;&#x2F;www.vobarian.com&#x2F;collisions&#x2F;2dcollisions2.pdf" rel="nofollow">https:&#x2F;&#x2F;www.vobarian.com&#x2F;collisions&#x2F;2dcollisions2.pdf</a><p>Please feel free to copy and use the code any way you wish.

no comments

no comments