
![idpic1](/img/extensions/clonerSystem/linearCloner.jpg "LinearCloner's with different transforming parameters")

The LinearCloner clones and distributes given meshes in a linear manner. If more than one mesh is provided, then the corresponding clones will be placed subsequently one after another. The LinearCloner can instantiate in two different interpolation-modes: absolute and relative. In the first mode the values of the input parameters (scale/rotation/position) can be seen as the difference from the first to the last clone, whereas in the relative mode those values are the difference from clone to clone.
The LinearCloner returns an object with an important property: **root**. It is an invisible mesh, it's the anchor and parent of all generated clones, its position is the position of the first clone. Transforming this **root** affects all underlying clones (children) at once but independently of the interpolation mode. Most of the input parameters are also available as properties and they are very suitable for animation (tweening). The given input meshes will be made inactive during construction, so after construction there will be only one of two possible mesh types: BABYLON **clones** or **instances**.  
_Note:_ Input meshes can be BABYLON meshes but other Cloners as well!

## Example

Example of a LinearCloner with a count of 10 clones (5 x cube1, 5 x cube2) with an increment vector of \{x:2,y:0,z:-1\} :

`const lc = new BABYLONX.LinearCloner([cube1, cube2], demo.scene, { iModeRelative:true,count:10,P:{x:2,y:0,z:-1} });`

Transforming of all clones can be done as you would do with a single mesh:

`lc.root.scaling.y = 2;`
`lc.root.rotation.x = Math.PI / 4;`

Animation can be done via properties:

`BABYLON.Animation.CreateAndStartAnimation('ani', lc, 'offset', 30, 120, 0, 10);`

## Parameters

`BABYLONX.LinearCloner( meshes, scene[, {optional parameters}])`

| Mandatory Parameter | Description                                                                           |
| ------------------- | ------------------------------------------------------------------------------------- |
| meshes              | array of meshes/cloners to be cloned, meshes will be made inactive after construction |
| scene               | BABYLON scene                                                                         |

| Optional Parameter | Description                                                             | Default Value          |
| ------------------ | ----------------------------------------------------------------------- | ---------------------- |
| count              | the nuber of clones                                                     | 3                      |
| offset             | offset in world units in the direction of the transform position vector | 0                      |
| growth             | weight factor for all transform parameters in percent/100               | 1                      |
| P                  | transform position vector                                               | \{ x: 0, y: 2, z: 0 \} |
| S                  | scale transformation                                                    | \{ x: 1, y: 1, z: 1\}  |
| R                  | rotation values in degrees                                              | \{ x: 0, y: 0, z: 0 \} |
| iModeRelative      | interpolation mode,                                                     | false (absolute)       |
| useInstances       | flag if clones should be technical "clones" or "instances"              | true                   |

| Properties | Description                                                                          |
| ---------- | ------------------------------------------------------------------------------------ |
| count      | @see Optional Parameter                                                              |
| offset     | @see Optional Parameter                                                              |
| growth     | @see Optional Parameter                                                              |
| position   | @see Optional Parameter P                                                            |
| scale      | @see Optional Parameter S                                                            |
| rotation   | @see Optional Parameter R                                                            |
| rotation3  | rotation values in radians \{x,y,z\}                                                 |
| offset     | @see Optional Parameter                                                              |
| root       | READONLY, getting an invisibe mesh representing the anchor of the cloner (root node) |
| effectors  | READONLY, gets a list of Effectors assigned to this Cloner                           |

| Methods                            | Description                                                                                                       |
| ---------------------------------- | ----------------------------------------------------------------------------------------------------------------- |
| addEffector(effector, sensitivity) | adds an effector to this Cloner and sets the sensitivity (1=full sensitivity, 0=no sensitivity ==ignore effector) |
| setEnabled(flag)                   | set the cloner's root node to the state of the flag (true=enabled)                                                |



![idpic1](/img/extensions/clonerSystem/matrixcloner.jpg "MatrixCloner")

The MatrixCloner clones and distributes given meshes in 3D space. If more than one mesh is provided, then the corresponding clones will be placed subsequently one after another starting in the x direction followed by y and z direction.  
The MatrixCloner returns an object with an important property: **root**. It is an invisible mesh, it's the anchor and parent of all generated clones, its position is the middle position of all generated clones. Transforming this **root** affects all underlying clones (children) at once. The given input meshes will be made inactive during construction, so after construction there will be only one of two possible mesh types: BABYLON **clones** or **instances**.  
_Note:_ Input meshes can be BABYLON meshes but other Cloners as well!

## Example

Example of a LinearCloner with a count of 10 clones (5 x cube1, 5 x cube2) with an increment vector of \{x:2,y:0,z:-1\} :

`const mc = new BABYLONX.MatrixCloner([cube1, cube2], demo.scene, { mcount: { x: 5, y: 5, z: 5 } });`

Transforming of all clones can be done as you would do with a single mesh:

`mc.root.scaling.y = 2;`
`mc.root.rotation.x = Math.PI / 4;`

## Parameters

`BABYLONX.MatrixCloner( meshes, scene[, {optional parameters}])`

| Mandatory Parameter | Description                                                                           |
| ------------------- | ------------------------------------------------------------------------------------- |
| meshes              | array of meshes/cloners to be cloned, meshes will be made inactive after construction |
| scene               | BABYLON scene                                                                         |

| Optional Parameter | Description                                                | Default Value          |
| ------------------ | ---------------------------------------------------------- | ---------------------- |
| mcount             | the nuber of clones in x,y and z direction                 | \{ x: 3, y: 3, z: 3 \} |
| size               | distance from one clon to another in x,y and z direction   | \{ x: 2, y: 2, z: 2 \} |
| useInstances       | flag if clones should be technical "clones" or "instances" | true                   |

| Properties | Description                                                |
| ---------- | ---------------------------------------------------------- |
| count      | READONLY, total number of clones after initialization      |
| size       | @see Optional Parameter                                    |
| mcount     | @see Optional Parameter                                    |
| effectors  | READONLY, gets a list of Effectors assigned to this Cloner |

| Methods                            | Description                                                                                                       |
| ---------------------------------- | ----------------------------------------------------------------------------------------------------------------- |
| addEffector(effector, sensitivity) | adds an effector to this Cloner and sets the sensitivity (1=full sensitivity, 0=no sensitivity ==ignore effector) |
| setEnabled(flag)                   | set the cloner's root node to the state of the flag (true=enabled)                                                |



![idpic1](/img/extensions/clonerSystem/objectcloner.jpg "ObjectCloner")

The ObjectCloner clones and distributes given meshes to the facet position of another input-mesh which acts as a template. If more than one mesh is provided, then the corresponding clones will be placed subsequently one after another starting in the order as the facets of the template mesh is defined.  
The ObjectCloner returns an object with an important property: **root**. It is an invisible mesh, it's the anchor and parent of all generated clones. Transforming this **root** affects all underlying clones (children) at once but independently of the interpolation mode. The given input meshes and the template mesh will be made inactive during construction, so after construction there will be only one of two possible mesh types: BABYLON **clones** or **instances**.  
_Note:_ Input meshes can be BABYLON meshes but other Cloners as well!

## Example

Example of a LinearCloner with a count of 10 clones (5 x cube1, 5 x cube2) with an increment vector of \{x:2,y:0,z:-1\} :

`const oc = new BABYLONX.ObjectCloner([cube1, cube2], icoSphere, demo.scene);`

Transforming of all clones can be done as you would do with a single mesh:

`mc.root.scaling.y = 2;`
`mc.root.rotation.x = Math.PI / 4;`

## Parameters

`BABYLONX.ObjectCloner( meshes, templatemesh, scene[, {optional parameters}])`

| Mandatory Parameter | Description                                                                           |
| ------------------- | ------------------------------------------------------------------------------------- |
| meshes              | array of meshes/cloners to be cloned, meshes will be made inactive after construction |
| templatemesh        | the mesh acting as template                                                           |
| scene               | BABYLON scene                                                                         |

| Optional Parameter | Description                                                | Default Value |
| ------------------ | ---------------------------------------------------------- | ------------- |
| useInstances       | flag if clones should be technical "clones" or "instances" | true          |

| Properties | Description                                                |
| ---------- | ---------------------------------------------------------- |
| effectors  | READONLY, gets a list of Effectors assigned to this Cloner |

| Methods                            | Description                                                                                                       |
| ---------------------------------- | ----------------------------------------------------------------------------------------------------------------- |
| addEffector(effector, sensitivity) | adds an effector to this Cloner and sets the sensitivity (1=full sensitivity, 0=no sensitivity ==ignore effector) |
| setEnabled(flag)                   | set the cloner's root node to the state of the flag (true=enabled)                                                |



![idpic1](/img/extensions/clonerSystem/radialCloner.jpg "RadialCloner's from left to right: aligned, unaligned, aligned clones")

The RadialCloner distributes given meshes in a radial manner. If more than one meshes are provided, then the clones will be placed alternatively. Several parameters controls the position, angle, type and orientation of the clones. The RadialCloner returns an object with one important property: **root**. It is an invisible mesh, it's the anchor, center and parent of all generated clones. Transforming this **root** (position/scale/rotation) affects all underlying clones (children) at once. Most of the input parameters are also available as properties and they are very suitable for animation (tweening). The given input meshes will be made inactive during construction, so after construction there will be only one of two possible mesh types: BABYLON **clones** or **instances**.  
_Note:_ Input meshes can be BABYLON meshes but other Cloners as well!

## Example

Example of a RadialCloner with a count of 24 clones (12 cubes cube1/cube2) distributed aligned with a radius of 6 units in the plane XZ:

`const rc = new BABYLONX.RadialCloner([cube1, cube2], demo.scene, {count:24,radius:6});`

Transforming of all clones can be done as you would do with a single mesh:

`rc.root.scaling.y = 2;`
`rc.root.rotation.x = Math.PI / 4;`

Animation can be done via properties:

`BABYLON.Animation.CreateAndStartAnimation('radanimation', rc, 'startangle', 30, 120, 0, 90);`

## Parameters

`BABYLONX.RadialCloner( meshes, scene[, {optional parameters}])`

| Mandatory Parameter | Description                                                                           |
| ------------------- | ------------------------------------------------------------------------------------- |
| meshes              | array of meshes/cloners to be cloned, meshes will be made inactive after construction |
| scene               | BABYLON scene                                                                         |

| Optional Parameter | Description                                                          | Default Value          |
| ------------------ | -------------------------------------------------------------------- | ---------------------- |
| count              | the nuber of clones                                                  | 3                      |
| radius             | radius in world units                                                | 3                      |
| align              | flag if clones are aligned against the middle position of the cloner | true                   |
| startangle         | angle in degrees                                                     | 0                      |
| endangle           | angle in degrees                                                     | 360                    |
| offset             | angle in degrees                                                     | 0                      |
| useInstances       | flag if clones should be technical "clones" or "instances"           | true                   |
| plane              | object \{x,y,z\} describing the cloners orientation                  | \{ x: 1, y: 0, z: 1 \} |

| Properties | Description                                                                          |
| ---------- | ------------------------------------------------------------------------------------ |
| count      | @see Optional Parameter                                                              |
| radius     | @see Optional Parameter                                                              |
| align      | @see Optional Parameter                                                              |
| startangle | @see Optional Parameter                                                              |
| endangle   | @see Optional Parameter                                                              |
| offset     | @see Optional Parameter                                                              |
| root       | READONLY, getting an invisibe mesh representing the anchor of the cloner (root node) |
| effectors  | READONLY, gets a list of Effectors assigned to this Cloner                           |

| Methods                            | Description                                                                                                       |
| ---------------------------------- | ----------------------------------------------------------------------------------------------------------------- |
| addEffector(effector, sensitivity) | adds an effector to this Cloner and sets the sensitivity (1=full sensitivity, 0=no sensitivity ==ignore effector) |
| setEnabled(flag)                   | set the cloner's root node to the state of the flag (true=enabled)                                                |



Each Cloner can have a set of Effectors assigned. At this time of writing, there is only one Effector available, the RandomEffector.

So what does an Effector generally? It influences properties of the clones cloned by a Cloner. The RandomEffector can influence all transformation properties (scale/rotation/position) with repeatable random values. Different random sequences can be achieved with a different **seed** value. The randomEffector can serve more than one cloner but it has only one property to control the strength of the random values. Therefore each cloner has a property **sensitivity** to accept either all or only a portion of the cloners strength.

_Note:_ the scaling transformation will be done in two different ways depending on the property **uniformScale**: if this property is set to true, only one random value will be used for all three scaling components (x,y,z) and the y/z components of the **scale property** will be ignored. If set to false, each direction is scaled independently with an extra random value.

## Example

In the following example a RandomEffector is created with a default seed value. After then the rotation values will be so adjusted, that the rotation random y-values are in the range 0-180, x and z are remaining unaffected. In the next step the RandomEffector is added to the RadialCloner with a sensitivity of 1 and finally the effectors strength is set to 1.

```javascript
let rc = new BABYLONX.RadialCloner([cube1, cube2], demo.scene, { count: 24, radius: 6 });

let reff = new BABYLONX.RandomEffector(); //default seed value

reff.rotation = { x: 0, y: 180, z: 0 };

rc.addEffector(reff, 1);

reff.strength = 1;
```

In this state, everything is prepared to influence the clone's y-rotation with random values in the range 0-180 degrees. With the function `reff.updateClients()` the clones will be updated.

## Parameters

`BABYLONX.RandomEffector(seed=42)`

| Optional Parameter | Description                                                        | Default Value |
| ------------------ | ------------------------------------------------------------------ | ------------- |
| seed               | the seed value for generating different sequences of random values | 42            |

| Properties   | Description                                                                |
| ------------ | -------------------------------------------------------------------------- |
| strength     | sets the strength of the generator (range 0 to 1)                          |
| uniformScale | true => all scaling directions with one value, false independently scaling |
| position     | sets position numbers in the range 0 to \{x:number,y:number,z:number\}     |
| scale        | sets the scale numbers in the range 0 to \{x:number,y:number,z:number\}    |
| rotation     | sets the rotation numbers in the range 0 to \{x:number,y:number,z:numbe\r} |

| Methods  | Description                                                  |
| -------- | ------------------------------------------------------------ |
| reset()  | resets the random generator to the beginning number sequence |
| random() | get the next random number                                   |



This system allows you take an array of meshes, clone them and display the results in a variety of patterns.

Be aware that the current documentation refers to the old version of Cloner. Meanwhile basic API is the same, so you can use it as reference.

The new Cloner version is [published at NPM](https://www.npmjs.com/package/bp-cloner) and is available to install with <pre>npm i bp-cloner</pre>



# Babylon Buffered Interpolation

Have you ever wanted to manage the position, rotation, and scale of networked Babylon.js objects? This [awesome package](https://github.com/virbela/buffered-interpolation) provides a fantastic solution. It is a port of Mozilla's [buffered-interpolation](https://github.com/InfiniteLee/buffered-interpolation) to Babylon.js and aims to work well both in situations with continuous and sparse network updates.

To see this system working live, check out the virtual co-presence experience: [Frame](https://framevr.io/).

To get started and learn more, head over to the [Virbela's Github page](https://github.com/virbela/buffered-interpolation).
