## Orbiting around a fixed axis

### Creating the 3D object

For starters, let’s create a simple 3D object in our scene. In this example, a sphere. It isn’t necessary to attribute a position to it for the moment!

```// sphere
const geometry = new THREE.SphereGeometry( 1, 32, 32 );
const material = new THREE.MeshPhongMaterial( { color: 0xffffff, flatShading: false } );
sphere = new THREE.Mesh( geometry, material );

### Calculating the orbital position with Cosinus, Sinus and Clock

We will use the mathematical functions Cosinus and Sinus, respectively `Math.cos()` and `Math.sin()` to place our 3D object into orbit.

At each execution of our principal loop, it is necessary to update the object’s position based on elapsed time. To keep an eye on the clock, we use the Three.JS class `Clock` .

The method `getDelta` of the `Clock` class, is used to obtain the number of seconds elapsed since the last execution of the method.

The property `elapsedTime` of the class `Clock` keeps track of the total number of seconds elapsed since the start of the application. This is the value that we will use to calculate the position of the object in orbit as a function of time.

At each execution of the main loop, we calculate the position of the object in orbit :

```function animate()
{
//time tracking
var delta = clock.getDelta();
var elapsed = clock.elapsedTime;

//sphere position
sphere.position.x = Math.sin(elapsed/2) * 3;
sphere.position.z = Math.cos(elapsed/2) * 3;

[...]
}```

We want to gravitate the 3D object to the Y axis :

We calculate the position on the X axis with `Math.sin()` of the elapsed time, then the position on the Z axis with `Math.cos()` of the elapsed time.

## Placing an orbit around a target in motion

It is also possible to apply these concepts to place an orbit around a moving target!

Let’s create a second 3D object, like this cube :

```//satelite
const geometry_satelite = new THREE.BoxGeometry( 0.4, 0.4, 0.4 );
const material_satelite = new THREE.MeshNormalMaterial( {  flatShading: true } );
satellite = new THREE.Mesh( geometry_satelite, material_satelite );

We want to make this new object orbit around the sphere in motion from the previous example. It is therefore necessary to include the position of the latter in the calculation of the satellite’s position, at each execution of the principal loop.

```function animate()
{
//time tracking
var delta = clock.getDelta();
var elapsed = clock.elapsedTime;

//sphere position
sphere.position.x = Math.sin(elapsed/2) * 3;
sphere.position.z = Math.cos(elapsed/2) * 3;

//satellite
satellite.position.x =  sphere.position.x + Math.sin(elapsed*2) * 2;
satellite.position.z = sphere.position.z + Math.cos(elapsed*2) * 2;
satellite.rotation.x += 0.4 * delta;
satellite.rotation.y += 0.2 * delta;

requestAnimationFrame( animate );
controls.update(); // only required if controls.enableDamping = true, or if controls.autoRotate = true
renderer.render( scene, camera );
}```

## Final result

See the Pen Gravitation by Thomas (@thomassifferlen) on CodePen.