I know toolbag and playcanvas best support PBR (physical based rendering). What pbr solution in three.js?
Please give some link or example.
toolbag pbr
playcanvas pbr
Below are some Three.js examples using PBR:
WebGLpbr
http://amine.dai.free.fr/three.js/pbr.html
The Khronos gltf format now has a proposed PBR extension in the works. The long-term goal is to have a standard 3D model format with PBR capability that is supported by Three.js and many other rendering engines.
As of this writing (Sept 2016) this is still in the early stages and there are no examples to share yet. Interested parties may track the list of PBR issues to follow along with the progress.
Check out THREE.MeshStandardMaterial. You get metalness and roughness properties along with the usual normal and ao
http://threejs.org/docs/#Reference/Materials/MeshStandardMaterial
Related
Somebody knows how it's possible to have so good quality for the 3D Objects like here http://showroom.littleworkshop.fr/? The objects are exported at this quality from 3DsMax or Blender or something similar, or the quality it's improved in threejs? As far I saw, the project was created with threejs. Any information regarding this project it will be helpful.
Thank you.
Question of quality is subjective. A better question would be "how can I create a scene using three.js with photo-realistic lighting and materials".
So here's an answer to that. There are a few points that make the example you provided look good:
1 - lighting. The example uses a mixture of direct and ambient lighting.
It is practically impossible to generate such lighting in real time in three.js (or any other 3d package for that matter) with the current state of the art on commodity hardware. So, you need to use light-maps. Light maps are pre-rendered textures of light and shadow, they can take a long time to generate, but look incredible, as demonstrated by example you mentioned. You can use Blender's Cycles renderer to generate light maps using "Bake" feature. The topic of lightmap generation is really outside of the scope of the question.
2 - Physically based materials. This is used to refer to material models that have excellent representation of real-life materials beyond "plastic". Three.js had at least 1 such maretial: StandardMaterial which is based on Metalness/Roughness/Albedo model (https://threejs.org/examples/?q=material#webgl_materials_standard)
good luck!
Turn on Antialias for better quality of rendering it works great
Also use lights as per requirement and camera view
I found Famo.us and it seemed pretty exciting but their docs are closed. I am very curios about WebGL so I started looking for alternatives. I found Three.js and Clara.io.
How do they differ from famo.us? What is the main objective of each framework?
Thanks.
Edit: Rephrased.
Three.js is a lightweight javascript library to create 3D visualisations (using WebGL, SVG, Canvas or another renderer).
Clara.io is an online 3D modelling tool using WebGL.
Famo.us is a javascript rendering engine to create web-apps with 3D user interfaces that promises to run smooth (60FPS) on mobile devices.
Famo.us claims to solve the HTML5 performance issue by avoiding DOM-layout and repaints, which are very expensive computations. Instead, Famo.us keeps a flat DOM and uses CSS3 transforms for all layout and positioning. Unlike the others you mentioned, Famo.us does not render using WebGL (yet), as Safari does not have this enabled by default.
Famo.us includes a physics engine to provide realistic and complex user interaction (e.g. bounce on a scrollview, 3D coverflow, that sorts of stuff). In Famous, you construct a scene-graph and add animations, events and physics to make everything come alive.
http://Clara.io is an online 3D modeling, rendering and publishing platform that can import and export in standard formats. It uses ThreeJS/WebGL and it imports and exports in the ThreeJS format as well.
Although Clara.io is not intended for creating applicatipns, you can also easily make interactive experiences Clara.io such as this demo by Klaas:
https://exocortex.github.io/klaas
Is multiple render targets supported in Three.js? I mean, using one single fragment shader to write to different render targets.
I have a fragment shader that calculates several things and I need to output them separately into different textures for further manipulations.
Multiple render targets are not supported in three.js.
If you are interested in GPGPU within the framework of three.js, you can find a nice example here: http://jabtunes.com/labs/3d/gpuflocking/webgl_gpgpu_flocking3.html. Just be aware, it is using an older version of three.js.
three.js r.60
Though the above answer was correct at the time of its writing, it is no longer the case.
With the introduction of WebGL2, ThreeJS does indeed support multiple render targets.
https://threejs.org/docs/#api/en/renderers/WebGLMultipleRenderTargets
I've been trying to figure out how you'd take a mesh generated in a program like 3ds max and bring that into your game with animations, textures, etc.
I've looked at FBX and Collada, but from what I've read, they're used as an intermediate step between the modelling software and some final format that may be custom to the game. What I'm looking for is a book or tutorial that would go over in a general way what you would store in your custom file, how you would store animation data, etc.
Right now I don't really have a general plan of attack and all of the guides I've seen stick to rendering a few triangles.
It doesn't have to be implementation specific to OpenGL, although that is what I'll be using.
Yes Collada is an interchange format.
What that means is it is very much generic. And if I am right that is exactly what you are looking for!
You can use a library such as Assimp to load collada into a generic scene graph, and then have your game/renderer use it directly, or preprocess and then consume it.
I need to know, what renderer has been used in the Sintel project. I think it wasn't default Blender Render because default Blender Render renders in horrible quality (If it isn't correct please correct me) . And I need to run it on 64-bit operating system (W7 HP) in blender 2.60. What I was searching, the best was Sunflow yet. What you think about / do you have any better suggestions?
I'm pretty sure they did use the blender internal renderer. Using proper lighting and materials you can get an excellent quality out of the blender renderer. If you are using one of the most recent blender versions you also might want to try the cycles renderer. It ships with blender but is still in beta. But without decent materials and lighting, no renderer will give you satisfying results.
Sintel used blender internal renderer. A branch was made which had some specific features used in sintel, now most of these features are merged into trunk *(as of 2.64).
Blender now comes with cycles rendering engine if you are after a raytracer which is reasonably competitive with other modern raytracers, though less mature of course.
The last commit to Sunflow was in 2008, seems its no longer in development.
Update: as of Blender 2.70 Cycles is almost feature complete, compared to Blender Internal renderer.