I have a problem with a blurry envmap on a MeshStandardMaterial in the editor.
This is the result in the current version of the editor (r125) on a MeshStandardMaterial with 0 roughness and 1.00 metalness
This is the result when I use a MeshBasicMaterial with the same editor:
Help will be much appreciated, Thanks
EDIT:
This is the texture:
I'm afraid you can't compare the environment map implementation between MeshBasicMaterial and MeshStandardMaterial (which is a PBR material). As mentioned by the documentation, a texture applied to MeshStandardMaterial.envMap should be pre-processed by PMREMGenerator. The editor does not do this for the envMap property right now.
Related
I took an equirectangular envMap from the three.js docs sample where it appears sharp on a sphere.
If I load the same material into my aframe scene with the following params
material="spherical-env-map: /assets/models/1/envtest.jpeg; roughness: 0; metalness: 1"
it appears blurry like this
What am I doing wrong?
Reproducible example via glitch: https://glitch.com/edit/#!/sepia-forest-keyboard
What I have noticed when setting up the glitch:
Using Aframe 1.0.3 it is blurry
Using Aframe 1.2.0 it remains black no matter what I do
That happens because you are using a PBR material in your code since the default material of A-Frame is MeshStandardMaterial. Meaning a material that tries to render physically correct. The official three.js example uses MeshLambertMaterial which is no PBR material. Both type of materials implement environment maps differently.
When using a PBR material, it's recommended to use a HDR environment map which is also pre-processed with PMREMGenerator like in this example: https://threejs.org/examples/webgl_loader_gltf
I tried with gltf. My model changes color with changes in frames. So hope to get a positive response. Thanks in advance [from grey color1 to [Red color][2]
As mentioned at the three.js forum, it's currently not possible to export animation of materials to glTF. Might be possible in the future though.
https://discourse.threejs.org/t/how-to-animate-alpha-in-blender-and-export-gltf-to-three-js/5428/2?u=mugen87
I'm creating terrain editor with three.js and i have encountered few problems.
First. Shadows renders on MeshLambertMaterial, but it wont on ShaderMaterial.
Second. How to change object's material (from lambert to shader) on runtime?
Here's demo of my editor: http://78.62.160.169/webgl/editor/
And source code: http://78.62.160.169/webgl/editor/script.js
LambertMaterial is a built-in material, that's supported by the plugins. So shadow plugin supports rendering on the LambertMaterial, while ShaderMaterial is your own shader/material, that should manually enable shadow support, it's not set by the default.
Switching material: https://github.com/mrdoob/three.js/wiki/Updates
here is the example of ShaderMaterial with shadow and fog
https://gist.github.com/wmcmurray/6696fc95f25bbd2401d72a74e9493261
or you can also rewrite a shader from LambertMaterial or other,
make it support your own shader
I want to render all the vertexes and the lines in the mesh.
I tried
1) A custom shader following this link
https://github.com/mrdoob/three.js/issues/2028
2) Set transparency with the material or like:
THREE.MeshNormalMaterial( { transparent: true, opacity: 0.5 } ),
3) Set ink material to the model in 3dMax and export to an obj file and load it in Threejs with objloader
None of them works fine.
Is there any solution to load mashes from 3dMax model (using objloader) and apply it with ink material in Threejs, just like what we can do in 3DMax?
See below as an example
http://makeitcg.com/wireframe-rendering-techniques-in-3ds-max/160/
First of all, Number 3) will NEVER work with OBJ, because obj will not export the ink shader from 3dsMax. And just to be clear, i don't think there is ANY way you can export the 3dsMax Shader.
Then, I don't understand what 2) is about. What do you want to achieve anyway? Do you want to set an object to be transparent? What does this have to do with Ink 'n Paint? Btw. i am not sure if transparency works for MeshNormalMaterial, i guess it should but Lambert and Phong will definetly work with transparency.
The problem is that you do not state what you want to achieve. From 1) it seems you want an outline around an object. For an outline see this example: http://stemkoski.github.io/Three.js/Outline.html or this one as a more advanced example: http://stemkoski.blogspot.de/2013/07/shaders-in-threejs-glow-and-halo.html
If you want to set transparent objects, well try MeshLambert or meshBasic material if MeshNormal does not work (i am not sure Right Now and can't check)
3) if you want to have a Ink 'n Paint shader, you need a Custom Shader. See examples here:
http://www.chromeexperiments.com/detail/cel-shader/
and already done with three.js here:
http://learningthreejs.com/data/THREEx/docs/THREEx.CelShader.html
Just apply the shader, see examples for setting up a ShaderMaterial.
In Three.js r47, I used CanvasRenderer to draw some objects with image texture. Then I upgrade Three.js to r49 and all these objects dont show up anymore. The change log of r49 reads that "Removed Lamber Texture support in CanvasRenderer". So I think this is the reason.
My question is does Three.js support an alternative to draw texture objects by CanvasRenderer?
Thanks.
Try using MeshBasicMaterial instead?