Can we use phong material with texture in three.js - three.js

Can we use PhongMaterial with texture in three.js
If we can give me some example links.
Please do send me your feedback on the issue. You help is highly appreciated.
Thanks for reading.
Regards, Vijay

If you look at the examples directory of three.js you will find plenty of examples that assign textures to PhongMaterial. To name a few webgl_materials_cars.html, webgl_materials2.html and webgl_lights_pointlights2.html. I hope these help.

The answer is yes. You can start with this tutorial:
http://www.html5canvastutorials.com/three/html5-canvas-three-js-phong-material/
and then add the following line of code right below the shininess property in the MeshPhongMaterial config object:
map: THREE.ImageUtils.loadTexture('http://www.html5canvastutorials.com/demos/assets/crate.jpg')
This will create a wooden textured cylinder with a Phong material (shiny material).

Related

Blurry envmap in MeshStandardMateiral in editor

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.

How to export color changing animation from Blender to three.js

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

How can I create a growing object in WebGL and Three.js and Tween.js

I am new to Three.js and Tween.js.
And I want to create an animation which an object could "grow": like an animation of 3D ball grows into a tube (or the 3D ball been dragged into the tube).
Can this been created by THREE.ExtrudeGeometry and Tween.js? If yes,
can I have some detail explanation or simple steps for this?
I'll be really appreciate for any better ideas. :)
Thank you very much.
Brs,
Bryan
If all your looking to do is alter the size of an object that can be accomplished by adjusting it's scale.
objectsName.scale.set( xValue, yValue, zValue );
However based on your description it seems like your looking to morph your object. There's a great example of how this can be accomplished located at threejs.org.
http://threejs.org/examples/#webgl_morphtargets
I hope this helps.

Smooth shading using Three.js

I need anyone to help me about my work
Work here :
ivanvujnovic.com/Avatar_final/index.html
I would have a better rendering, like smooth shading or something else.
How can i do that?
Thank's
You already have smooth shading happening there. I believe you might be looking for 'pixel shading' or 'pixel lighting'.
This might be useful:
http://www.opengl.org/sdk/docs/tutorials/ClockworkCoders/lighting.php
Looks like the normals are messed up in your model, or there is a glitch translating them with Three.js making for a bumpy look by messing up the lighting.
You could try to re-export your model and check any normal-related export options if the problem could be solved with using different configuration.
Or you could let Three.js try to recalculate new normals for your geometry, ignoring the ones existing in the model:
geometry.computeFaceNormals();
geometry.computeVertexNormals();

Irrlicht Human Mesh Animation

does anybody know how anime(move) Human body Parts in Irrlicht.
I only found Animathion for the whole mesh.
I´m using makehuman.org mesh and want only to move the hand or the leg in irrlicht. There are riggins and bones in the mesh but I dont know how to move them in Irrlicht.
pls help a noob.
thx in advance
With a quick google search, you would have found this wiki page…
All you need to know is the names of the bones of your mesh and get them as IBoneSceneNodes using IAnimatedMeshSceneNode's getJointNode method.
A IBoneSceneNode can be animated and moved around like any regular scene node.

Resources