I'm looking at drawing the edges of a mesh like on the following picture:
I tried to use THREE.EdgesHelper however it only groups the triangles that are in the same plane and therefore it looks like the wireframe on curved areas which I want to avoid.
Ideally it would be some sort of helper that I could display/hide/change colour.
I'm not exactly sure about what to look at for a starting point and your help would be much appreciated.
Thank you!
Related
I need to run some calculations on meshes using ThreeJS.
The calculation should involve the faces of the mesh, but not the triangular ones.
for example in the attached image, I'd like to consider both of the triangles of the top faces as a single face.
Is there a way to know which triangles go together?
I've seen that the geometry has a "groups" property.
https://threejs.org/docs/#api/en/core/BufferGeometry.groups
But it just says it is used to split the rendering.
Can I rely on it to determine that the vertices in the group form the "face" that I need?
Is there any other way to get it?
Is it possible in Three.js to interpolate two meshes like this? At the area where they intersect should have a nice smooth transition.
I think I've seen it somewhere, but I can't find it.
EDIT
The metaball/cube concept is much closer to what I'd like to achieve:
https://www.youtube.com/watch?v=f42zr__yW_Q
http://threejs.org/examples/webgl_marchingcubes.html
I found the way to do it. It's called raymarching distance fields.
Here's an example:
https://www.shadertoy.com/view/4dsGRl
Also a presentation:
http://www.iquilezles.org/www/material/nvscene2008/rwwtt.pdf
What I'm trying to do is to "drape" some points on a PlaneGeometry. I have the planar coordinates of the points in the same coordinate system of my plane geometry, what I need i sto get the "height" from the plane to position the points on top of it.
What's the best way to achieve it? Querying the planar mesh in Javascript would be to heavy. Should it be done (and could it be done) using the vertex shader?
EDIT
Probably using a ray caster is the right solution, something like shown in this example: http://threejs.org/examples/#webgl_geometry_terrain_raycast
EDIT2
Raycasting does the job, but it's quite slow for a lot of objects. I suppose there are more efficient ways to do that...
https://dl.dropboxusercontent.com/u/13861666/2014-01-17%2011_27_15-firenze.png
Am trying to do this with three.js
I have this PlaneGeometry(a rectangle) and I want it to move along the vertexes of a CircleGeometry, just like a train on a rail.
any idea how to achive this realy smoothly?
You could take your THREE.Mesh and .add(object) it to a new THREE.Object3 at the center of your THREE.CircleGeometry, then move your THREE.Mesh to the edge of the circle by .set(x,y,z) it's position. Note that now your mesh is added to the object3, the positions of your mesh will be relative to the object3. This means that when you rotate the object3, the plane will pivot around it, and eventually rotate around the circle.
The way I described would only work for circles. If you want more complex shapes, I'd use THREE.Spline.
Hope this helps.
I have an airplane. I use rectangle for bounding this airplane to detect collision and it works great. When the airplane begin falling down I rotate airplane's texture, but rectangle remains unchanged. I don't know how to rotate it. I need to rotate it with airplane's texture because my shell doesn't collide the airplane's tail and cabine.
How to rotate rectangle or perhaps create polygon shape to wrap all airplane? Any help will be appreciated!
#jellyfication's answer points to raycasting, but a different and also simple approach you could implement is the Separating Axis Theorem. The links below will show you in detail what the algorithm is about and how to implement it. They also have some interactive demos so you get the 'feel' for what the algorithm is doing.
http://www.metanetsoftware.com/technique/tutorialA.html
http://www.sevenson.com.au/actionscript/sat/
http://www.codezealot.org/archives/55 (this one has a lot of code)
http://gamedev.tutsplus.com/tutorials/implementation/collision-detection-with-the-separating-axis-theorem/
Good luck!
Use the polygon class to and draw your bounding Box.
Then within the polygon class there is a method to rotate.
Rotate and move the polygon with the plane.