Three.js and webgl – cube reflection Try 3D on the Internet

1

At the end of the week I have some fantastic 3D animations for you. The animated 3D car illustrations are from the sample collection of three.js . With the JavaScript library three.js you can create animated representations in 3D in the browser. three.js creates a spatial impression using the anaglyph image technique.

My regular readers can still remember the 3D teapot on a bridge?

navigation Help

Rotate 3D model: Press the left mouse button and move the mouse
Zoom In / Zoom Out: Turn the mouse wheel
Move: hold down the middle mouse button and move the mouse

The examples can be displayed in a new browser window.
https://blog.r23.de/3d/loader/cubemap.html

On the bridge today we turn the cars in the air: Bugatti Veyron, Lamborghini Gallardo, Ferrari F50 and Chevrolet Camaro. In the 3D animations, we can change the paint with a click. Bugatti Veyron was created by Troyano , Lamborghini Gallardo was made by machman_3d , Ferrari F50 was made by daniel sathya and Chevrolet Camaro was created by dskfnwn .

Before we take a look at the 3D animation, we’ll have some physics.

The one-body problem

Imagine a universe that is completely empty except for a single celestial body (mass), such as a star or planet. In such a universe, the following one-body problem arises:

From an initial position and velocity for mass, how can you predict the mass’s motion as a function of time?

The answer, as you may know, is simple:

  • When the speed v of the mass is 0 , the mass never moves (no movement).
  • If the velocity v of the mass is not 0 , the mass moves at a constant velocity and direction corresponding to v .

Although there is no interesting dynamics in the one-body problem, it does offer the opportunity to set up a Three.js “universe.”

 

The example can be displayed in a new browser window.
https://blog.r23.de/r23webvr/three.js-r86/examples/webgl_materials_cars.html

code

The source code for the 3D surface models is available.

[cc lang=”php” tab_size=”3″ lines=”80″]

 

 

 

three.js webgl demo :
texture by Humus :

Bugatti Veyron model
by Troyano




 

[/cc]

 

Source: https://blog.r23.de/3d-im-internet-three-js-webgl/

Share This:

Powered by FrontNet