
# Getting Started - A Lathe Turned Fountain

## A Lathe Turned Fountain

Time to introduce another of the many ways to create a mesh: the *CreateLathe* method. We start with a profile for the fountain.

![profile](/img/getstarted/profile.webp)

The profile is described, in an array, using the x and y components of a 3D vector.

```javascript
const fountainProfile = [
	new BABYLON.Vector3(0, 0, 0),
	new BABYLON.Vector3(10, 0, 0),
	new BABYLON.Vector3(10, 4, 0),
	new BABYLON.Vector3(8, 4, 0),
	new BABYLON.Vector3(8, 1, 0),
	new BABYLON.Vector3(1, 2, 0),
	new BABYLON.Vector3(1, 15, 0),
	new BABYLON.Vector3(3, 17, 0)
];
```

The array is used in the shape property of the options parameter in the *CreateLathe* method.

```javascript
const fountain = BABYLON.MeshBuilder.CreateLathe("fountain", {shape: fountainProfile, sideOrientation: BABYLON.Mesh.DOUBLESIDE}, scene);
```

As before, the scene parameter is optional. In this case, the mesh is set to double-sided because the inside is visible due to the slope at the top and the hollow middle.

<Playground id="#TC31NV#3" title="Basic Lathe Fountain" description="Use the createLathe method to create a fountain." image="/img/playgroundsAndNMEs/gettingStartedLathe1.webp"/>

With appropriate scaling and positioning, this is added to the village.

<Playground id="#KBS9I5#91" title="Add the Fountain" description="Add the fountain into the village." image="/img/playgroundsAndNMEs/gettingStartedLathe2.webp"/>

A fountain without a spray of water is a little boring, so we simulate the spray with particles.



# Getting Started - Working With Code

## Particle Spray
In this case, particles are small sprites emitted in a cluster, or cloud, to simulate fire, smoke, water, or even faery dust.

The basis for a cloud of particles is the *ParticleSystem*. With this, we specify the number of particles to use.
```javascript
const particleSystem = new BABYLON.ParticleSystem("particles", 5000, scene);  //scene is optional
```

Particles are emitted from a specifically defined region. Each particle is given a lifetime, and when that lifetime is reached, it is reused and re-emitted.

They are given a texture, which governs their appearance.

```javascript
particleSystem.particleTexture = new BABYLON.Texture("textures/flare.png", scene);
```

The basic emitter region is a box of given dimensions around a specified point:
```javascript 
particleSystem.emitter = new BABYLON.Vector3(0, 10, 0); // the point at the top of the fountain
particleSystem.minEmitBox = new BABYLON.Vector3(-1, 0, 0); // minimum box dimensions
particleSystem.maxEmitBox = new BABYLON.Vector3(1, 0, 0); // maximum box dimensions
```

Up to three colors can be given in the form (r, g, b, a) for red, green, blue, and alpha. Alpha goes from 0 for fully transparent up to 1 for fully opaque. The first two are combined, or blended, to set the color of the particle. The method of blending can be specified. The third is the *colorDead* property and is useful when particle recycling is turned off. This third property is not needed for our fountain.
```javascript
particleSystem.color1 = new BABYLON.Color4(0.7, 0.8, 1.0, 1.0);
particleSystem.color2 = new BABYLON.Color4(0.2, 0.5, 1.0, 1.0);

particleSystem.blendMode = BABYLON.ParticleSystem.BLENDMODE_ONEONE;
```

The size of a particle and its lifetime are within the range set by minimum and maximum values.
```javascript
particleSystem.minSize = 0.1;
particleSystem.maxSize = 0.5;

particleSystem.minLifeTime = 2;
particleSystem.maxLifeTime = 3.5;
```

We also need to set the number of particles emitted per second. Too high an emission rate with a long lifetime can result in gaps in the particle emission.
```javascript
particleSystem.emitRate = 1500;
```

We also set two possible directions for the particles and control the speed at which each particle travels by giving a minimum and maximum power value and an update speed.
```javascript
particleSystem.direction1 = new BABYLON.Vector3(-2, 8, 2);
particleSystem.direction2 = new BABYLON.Vector3(2, 8, -2);

particleSystem.minEmitPower = 1;
particleSystem.maxEmitPower = 3;
particleSystem.updateSpeed = 0.025;
```

Setting a negative value for gravity in the y component ensures the particles fall downward.
```javascript
particleSystem.gravity = new BABYLON.Vector3(0, -9.81, 0);
```

Finally, we can start the fountain:
```javascript
particleSystem.start();
```

Here is an example of our fountain:

<Playground id="#TC31NV#4" title="Add the Spray" description="Create a basic particle system as water spray." image="/img/playgroundsAndNMEs/gettingStartedParticleSpray1.webp"/>

Let's now provide an on-off click event.


## A Particle Fountain

Every village needs water, so let's put in a fountain. We will go for one with rotational symmetry and use a lathed mesh to create it. Fine particles will be recycled to produce a water effect. So that we do not waste water, let's add a switch event to turn it on or off.

Getting Started - Chapter 6 - A Lathe Turned Fountain

A Lathe Turned Fountain