Transparency in three.js scene.background texture - three.js

I could not change it, even with opacity in video css tag.
Thanks for possible answer.
José Roberto Lazzareschi

The suggestions did not helped me.
I´ve changed the opacity of the movie in Movavi and solved my desire.
...var videobg=document.getElementById('video');
...var texturebg=new THREE.VideoTexture(videobg);
...scene.background=texturebg;
Thank You for the attention.
José Roberto

Related

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();

OpenGL-es Sprite Sheets

I am making a game in OpenGL-es. I have a question, how do you make a sprite sheet in Xcode for you sprite png. Any code examples on how to do the sprite sheets may help.
Thank you!
You need an external tool. A web search engine is your friend: sprite+sheet+generator+mac

Can we use phong material with texture in 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).

Resources