I'm hoping to do simple collision detection with a Geometry/BufferGeometry against some planes and I was wondering if Three.js contains a way to return only the part of a BufferGeometry that's on one side of a Plane, as another BufferGeometry?
I know that you can use Three.js to clip meshes with Planes when rendering, however I can't spot a way to do the clipping outside of the GPU.
I know CSG.js could be used, but this seems overly heavyweight for what I need.
Related
I'm using Three.js to create a spiral galaxy I've gone down the InstancedBufferGeometry so I can render lots of stars with great performance.
For now, I'm using a plane as my object, the trouble I have is that when I orbit around the galaxy these planes don't look at the camera.
I have tried using the lookat function however that doesn't seem to work.
Does anyone know how to get InstancedBufferGeometry to look at the camera.
Many thanks in advance.
The lookAt method belongs to THREE.Object3D, and it makes the entire object rotate towards a point, not each of its geometry's instances. If you're using InstancedBufferGeometry, you could perform these calculations in the vertexShader, but can be computationally expensive, given the quantity of planes you're rendering.
If you're using InstancedBufferGeometry for planes only, I recommend you use THREE.Points instead, which is made to automatically generate planes that always look towards the camera, as demonstrated in these examples:
https://threejs.org/examples/?q=point#webgl_points_sprites
https://threejs.org/examples/?q=point#webgl_custom_attributes_points
All you'd need to worry about is their positions, and the rotations will always "billboard" towards the camera without the need of manually calculating rotations.
I have a 2D plane with a tree texture that always faces the general direction of the camera by rotating only on its Y axis. It works great and the shadows are cast perfectly, but I don't want the shadow of the 2D plane to rotate with it.
I'd like the shadow to appear so that the 2D object is always facing directly at a light source even when its not. I've tried messing with shaders without any luck. Should I be investigating shader tricks with this, or is there already something available from within Three.js that can do this already?
I was thinking it's that or come up with an invisible plane at the same position of the other 2D plane, and force it to face the light source and cast shadows, but that would cause other complications.
The reason for needing this is to keep thick, bushy shadows for 2D trees in a scene.
My question is related to this article:
http://blog.wolfire.com/2009/06/how-to-project-decals/
If my understanding is correct, a mesh made from the intersection of the original mesh and a cube is added to the scene to make a decal appear.
I need to save the final texture. So I was wondering if there is a way to 'merge' the texture of the original mesh and the added decal mesh?
You'd need to do some tricky stuff to convert from the model geometry space into UV coordinate space so you could draw the new pixels into the texture map. If you want to be able to use more than one material that way, you'd also probably need to implement some kind of "material map" similar to how some deferred rendering systems work. Otherwise you're limited to at most, one material per face, which wouldn't work for detailed decals with alpha.
I guess you could copy the UV coordinates from the original mesh into the decal mesh, and the use that information to reproject the decal texture into the original texture
I need to draw transparent 2D sprites in a 3D world. I tried rendering a QUAD, texturing it(using slick_util) and rotating it to face the camera, but when there are many of them the transparency doesn't really work. The sprite closest to the camera will block the ones behind it if it's rendered before them.
I think it's because OpenGL only draws the object that is closest to the viewer without checking the alpha value.
This could be fixed by sorting them from furthest away to closest but I don't know how to do that
and wouldn't I have to use math.sqrt to get the distance? (I've heard it's slow)
I wonder if there's an easy way of getting transparency in 3D to work correctly. (Enabling something in OpenGL e.g)
Disable depth testing and render transparent geometry back to front.
Or switch to additive blending and hope that looks OK.
Or use depth peeling.
What's the best way to draw arbitrary textured shapes in WP7/XNA? I'm thinking I'm going to have to use polygons in orthographic projection but if there is a method to do this using textures I would much prefer that.
The best way is with textured polygons in an orthographic projection :)
You could pre-compute textures for sprites in the shapes you want - but that has its own problems. The first two I can think of are: 1) having to implement it! and 2) burning through a whole lot of texture-fetch, fill-rate and texture memory to draw a lot of blank space.