TypeError: this.mesh.geometry.area is not a function

Question

I've working lately with JavaScript and Three.js with Leapmotion, and I started using the leap widgets (http://blog.leapmotion.com/leapjs-widgets-new-library-3d-web-design/here!) library to add some cool buttons to my program.

After many hours, I got this type error from one of the libraries. Is it something mine? I just can't figure it out...

TypeError: this.mesh.geometry.area is not a function

This refers to this code:

  this.mass = this.mesh.geometry.area() * this.density;

This library doesn't look like its working ok.

Answer 1

As answered in this issue: https://github.com/leapmotion/leapjs-widgets/issues/4

#area is a custom method added by this project to particular THREE.js geometries.

This error occurs when you try and turn a non-supported geometry in to a button. Supported geometries are PlaneGeometry and CircleGeometry.

I have some code sitting around from MozVR which will scale a box to make it look like it is being pushed by a plane. Here: https://github.com/leapmotion/HIRO/blob/master/js/vrhud.js#L290-L319 Note that scale must be used, because that's the only way to resize an initialized THREE.js geometry.

Edit: This seems to be a fairly common issue. Perhaps in a future release we'll make the error more explicit.