Skip to content

Instantly share code, notes, and snippets.

@ayamflow

ayamflow/.js

Created February 16, 2016 01:37
Show Gist options
  • Save ayamflow/462190f13eeef04f01cb to your computer and use it in GitHub Desktop.
Save ayamflow/462190f13eeef04f01cb to your computer and use it in GitHub Desktop.
Download ZIP
Three.js - get visible width/height in pixels for an object
Raw
.js
// http://stackoverflow.com/a/13351534
var vFOV = this.camera.fov * Math.PI / 180;;
var h = 2 * Math.tan( vFOV / 2 ) * this.camera.position.z;
var aspect = width / height;
var w = h * aspect;
@enijar
Copy link

enijar commented Jan 6, 2022

Thanks for this. And to get the actual object size you would do this (assuming your canvas is full width and height):

const vFov = (camera.fov * Math.PI) / 180;
const height = 2 * Math.tan(vFov / 2) * camera.position.z;
const aspect = window.innerWidth / window.innerHeight;
const width = height * aspect;
const pixelSize = window.innerWidth * ((1 / width) * sizeOfObject) // (e.g. sizeOfObject = 0.2)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment