

## Disc or Regular Polygon
The created disc is a flat surface parallel to the xy plane, with its origin at the center of the disc. The word disc is a bit of a misnomer, since you can use it to create any kind of regular polygon. The number of sides depends on the value given to _tessellation_. The larger this value, the closer it is to an actual disc. Using the arc option, you can create a sector.

## MeshBuilder
Usage :
```javascript
const disc = BABYLON.MeshBuilder.CreateDisc("disc", options, scene); //scene is optional and defaults to the current scene 
```

option|value|default value
--------|-----|-------------
radius|_(number)_ the radius of the disc or polygon|0.5
tessellation|_(number)_ the number of disc/polygon sides|64
arc|_(number)_ ratio of the circumference between 0 and 1|1
updatable|_(boolean)_ true if the mesh is updatable|false
sideOrientation|_(number)_ side orientation|DEFAULTSIDE


### Examples
Disc: <Playground id="#MVSQWZ#1" title="Create a Disc" description="Simple example of creating a disc."/>
Triangle: <Playground id="#MVSQWZ#2" title="Create a Triangle" description="Simple example of creating a triangle."/>
Sector: <Playground id="#MVSQWZ#3" title="Create a Sector" description="Simple example of creating a sector."/>

## Mesh
Usage :
```javascript
const disc = BABYLON.Mesh.CreateDisc("disc", radius, tessellation, scene);
const disc = BABYLON.Mesh.CreateDisc("disc", radius, tessellation, scene, updatable, sideOrientation); //optional parameters after scene
```


## Torus
The created torus (doughnut shape) has its origin at the center of the torus. You can control its diameter and the thickness of its circular body.

## MeshBuilder
Example :
```javascript
const torus = BABYLON.MeshBuilder.CreateTorus("torus", options, scene);
```

option|value|default value
--------|-----|-------------
diameter|_(number)_ diameter of the torus|1
thickness|_(number)_ thickness of its tube|0.5
tessellation|_(number)_ number of segments along the circle|16
updatable|_(boolean)_ true if the mesh is updatable|false
sideOrientation|_(number)_ side orientation|DEFAULTSIDE
frontUVs|_(Vector4)_  **ONLY WHEN sideOrientation:BABYLON.Mesh.DOUBLESIDE set** | Vector4(0,0, 1,1) 
backUVs|_(Vector4)_  **ONLY WHEN sideOrientation:BABYLON.Mesh.DOUBLESIDE set** | Vector4(0,0, 1,1) 

### Examples
Thick: <Playground id="#IJGMXZ#1" title="Create a Thick Torus" description="Simple example of creating a thick torus."/>
Thin: <Playground id="#IJGMXZ#2" title="Create a Thin Torus" description="Simple example of creating a thin torus."/>

## Mesh
## Usage
```javascript
const torus = BABYLON.MeshBuilder.CreateTorus("torus", {diameter, thickness, tessellation, updatable, sideOrientation}, scene);
```



## Tiled Plane
A tiled plane is only available with MeshBuilder. The tile size, pattern, and alignment can be set.

## MeshBuilder
Usage :
```javascript
const tiledPlane = BABYLON.MeshBuilder.CreateTiledPlane("plane", options, scene); //scene is optional and defaults to the current scene
```

option|value|default value
--------|-----|-------------
size|_(number)_ side size of the plane|1
width|_(number)_ size of the width|size
height|_(number)_ size of the height|size
tileSize|_(number)_ size of each tile side|1
tileHeight|_(number)_ tile height size, overwrites _tileSize_ option|tileSize
tileWidth|_(number)_ tile width size, overwrites _tileSize_ option|tileSize
frontUVs|_(Vector4)_  **ONLY WHEN sideOrientation:BABYLON.Mesh.DOUBLESIDE set** | Vector4(0,0, 1,1) 
backUVs|_(Vector4)_  **ONLY WHEN sideOrientation:BABYLON.Mesh.DOUBLESIDE set** | Vector4(0,0, 1,1)
pattern|_(number)_ how tiles are reflected or rotated|NO_FLIP
alignVertical| _(number)_ positions whole tiles at top, bottom or center of a face|CENTER
alignHorizontal| _(number)_ positions whole tiles at left, right or center of a face|CENTER
updatable|_(boolean)_ true if the mesh is updatable|false
sideOrientation|_(number)_ side orientation|DEFAULTSIDE   

The values for the *pattern* option are the following constants:

```javascript
BABYLON.Mesh.NO_FLIP, default
BABYLON.Mesh.FLIP_TILE,
BABYLON.Mesh.ROTATE_TILE,
BABYLON.Mesh.FLIP_ROW,
BABYLON.Mesh.ROTATE_ROW,
BABYLON.Mesh.FLIP_N_ROTATE_TILE,
BABYLON.Mesh.FLIP_N_ROTATE_ROW
```

The TILE ending means that every other tile across and up the plane is flipped or rotated.  
The ROW ending means that the whole of alternate rows are flipped or rotated.

When the width or height of the plane is such that a whole number of tiles does not fit, tiles are "cut" and partial tiles are used to fill the plane. When this happens, you can arrange where the partial tiles are placed, either at one edge of the plane or uniformly on two opposite edges. You do this by setting *alignVertical* and *alignHorizontal* in the options to indicate where you want the whole tiles to be placed. For example, setting *alignHorizontal* to *LEFT* means that the leftmost column of tiles will be whole tiles and the rightmost column will contain partial tiles. The following constants are available for *alignVertical* and *alignHorizontal*:

```javascript
BABYLON.Mesh.CENTER, default
BABYLON.Mesh.TOP,
BABYLON.Mesh.BOTTOM
```

```javascript
BABYLON.Mesh.CENTER, default
BABYLON.Mesh.LEFT,
BABYLON.Mesh.RIGHT
```

There are 7 * 3 * 3 = 63 different arrangements for the tiles.

Using the *frontUVs* and *backUVs* properties in the options, the front and back of the plane can use different parts of an image.


```javascript
const f = new BABYLON.Vector4(0.5,0, 1, 1); // front image = half the whole image along the width 
const b = new BABYLON.Vector4(0,0, 0.5, 1); // back image = second half along the width

const options = {
    frontUVs: f,
	backUVs: b,
	sideOrientation: BABYLON.Mesh.DOUBLESIDE
}
``` 

## Examples

The following image is used to show the results before and after flipping alternate tiles.

![Single Tile Pattern](/img/how_to/Mesh/lavatile.webp) 

Before tiles flipped: <Playground id="#XR696D" title="Create a Tiled Plane With Before Tiles Flipped" description="Simple example of creating a tiled plane with before tiles flipped."/> 
After tiles flipped: <Playground id="#XR696D#1" title="Create a Tiled Plane With After Tiles Flipped" description="Simple example of creating a tiled plane with after tiles flipped."/>

**Alternating Patterns**

This image  
![Two Tile Pattern](/img/how_to/Mesh/tiles2.webp)  
is used to show different alternating patterns using tiles with a width of 2 and a height of 1 by flipping either every other row or every other tile.

Row flipped: <Playground id="#XR696D#3" title="Create a Tiled Plane With Row Flipped" description="Simple example of creating a tiled plane with row flipped."/>
Tile flipped: <Playground id="#XR696D#4" title="Create a Tiled Plane With Tile Filed" description="Simple example of creating a tiled plane with tile filed."/>

and also how tiling can be different front and back.

<Playground id="#XR696D#2" title="Create a Tiled Plane With Different Tiling Front And Back" description="Simple example of creating a tiled plane with different tiling front and back."/>


The final example uses the same image to show all 63 permutations. To see the headings, view the full playground.
<Playground id="#XR696D#5" title="Create a Tiled Plane With 63 Different Permutations" description="Simple example of creating a tiled plane with 63 different permutations."/>

option	value	default value
radius	(number) the radius of the disc or polygon	0.5
tessellation	(number) the number of disc/polygon sides	64
arc	(number) ratio of the circumference between 0 and 1	1
updatable	(boolean) true if the mesh is updatable	false
sideOrientation	(number) side orientation	DEFAULTSIDE

Creating A Disc

Disc or Regular Polygon

MeshBuilder

Examples

Mesh