So I have an object that I created by drawing vertexes on a 3D canvas using Three.JS. Now I am trying to add faces to to it but I can not seem to get the correct method for this.
You can find the project here: https://github.com/thebillkidy/WebGL-SuperFormula (Basically it is applying the Superformula in WebGL)
I already tried point clouds, lines and ConvexGeometries but none seem to work. Anyone knows how to do this?
P.S. You can find my current render method here: https://github.com/thebillkidy/WebGL-SuperFormula/blob/master/app/scripts/main.js I also added the other methods that I tried.
Related
I'm trying to find a way to slice a 3D polyhedral that has defined positions in the polyhedra JSON, the idea is to give a point A and point B that are going to work as cutting points.
Is there any way to do that with JavaScript like an algorithm? Is there any library that can help doing that?
I'm using Babylon.js as the 3D library, tried with CSG calculations with results that doesn't work as expected so I'm trying to find a solution that works on JavaScript and not in Babylon.js.
I am working on some project basically for the real estate and kind of stuck in some feature where I need some help.
I have a 3D scene ready using three JS and rendered on screen, but sometimes the user wants to see in 2D and sometimes in wireframe.
see images below
one way to do is to keep the camera at top of the 3D view and make model wireframe true.
but I am looking for the alternate way to convert a 2D image of top view into the structure like above. Is there any library or method that can help in solving this.
Thanks
I'm having trouble to correctly apply a texture on object.
As you can see from this picture: http://i.stack.imgur.com/4WpP4.png the texture is repeated and not applied continuously across whole the front face of the object.
Here: http://goo.gl/Dx6hDI you can find the code and a live example.
someone can help me ?
Your object does not have correct UV coordinates. Load the object into a 3d editor, apply the coordinates you want, then export new version.
I'm wanting to find a javascript library that will create images of simple 3D shapes like the ones shown below.
The key is that I want to be able to specify certain attributes of the shapes. So, take a cylinder, for example. I'd want to tell the library the radius and the height and have it create the cylinder for me.
Does anyone know of something that can do this?
I am drawing two relative simple shapes and the geometry of them do not overlap.
Here is the code sample:
http://jsfiddle.net/pGD4n/9/
The Three.js Trackball is in there so you can click and drag to spin the objects around in 3d space. The problem is that as the objects rotate some faces disappear revealing the object below. A slight more rotation and the missing face returns, but others have gone missing.
I've tried BasicMaterial, Normal Material and LambertMaterial with both SmoothShading and Flat Shading. I have tried the scene with and without lighting. Moving the objects farther apart seems to correct the issue, but in the given example code the meshes do not overlap and should not have this problem. Problem happens in both Chrome and Firefox.
I imagine that switching to the OpenGL renderer would resolve the issue, but for compatibility we need use the Canvas renderer.
Any help or ideas appreciated.
This is a limitation of CanvasRenderer. Unfortunately per pixel z sorting is not available in CanvasRenderer so it basically tries to sort the whole polygon instead. Depending of where you're looking from the center of one polygon may be closer than the polygon on the side and so it "jumps".
The only solution right now is using WebGLRenderer. I'm working on a new renderer for context2d which hopefully will solve this without requiring webgl but it will still take some time.