$chiubaca / notes / fleeting / 2021-09-05
  • Still chipping away at the three.js journey camera lesson! Lots magic numbers to remember
    • aspect ratio can be figured out like so:
    const sizes = {
      width: 800,
      height: 600,
    };
    const aspectRatio = sizes.width / sizes.height;
    • When tracking the mouse, we need to covert the pixel coordinates to normalises matrix grid. So that mouse tracking behaves consistently acorss screen sizes.
    window.addEventListener("mousemove", (e) => {
      cursor.x = e.clientX / sizes.width - 0.5;
      cursor.y = e.clientY / sizes.height - 0.5;
      console.log("hey", cursor);
    });
    • it doesnt necessarily have to be 0.5
Edit on GitHub ✏️

Hey I'm Alex Chiu 👋. These are my notes for literally anything.

I'm using the Zettelkasten method to organise my thoughts here.

My more polished writings are published to my main blog at chiubaca.com

Follow me on: Github / X (Twitter) / Mastodon / LinkedIn