The new Cloner System for Babylon.js

Hello friends,

Once upon a time where was the Cloner System among Babylon.js extensions - Babylon.js docs

Since it was quite old (7 years for now) there was a lot of issues relating to how to make it work with ES6 and so on, like ObjectCloner Issue:

Moreover, 2 weeks ago this extension was removed from Babylon.js Extensions repo - Delete ClonerSystem directory · BabylonJS/Extensions@730081f · GitHub

Meanwhile it has a lot of useful functions.

Here is the new clean version of Cloner System with proper typing, ES6 support and much more. clonerSystem/src/clonerSystem at main · eldinor/clonerSystem · GitHub

Animated demo is here – https://clonersystem.babylonpress.org/

API - https://clonersystem.babylonpress.org/docs/

Github repo with animated demo example - GitHub - eldinor/clonerSystem: Cloner System for Babylon.js

The original Cloner System had quite extensive documentation (which suits the new version as well) and a lot of PG examples, like Cloner with extended UI https://playground.babylonjs.com/#1WRUHY#2.

image

In the new versions BABYLONX namespace was removed (as well as all other unnecessary stuff) but all API is actually the same. Also, there were some new methods added for thin instancing:

toThin() – Converts the Cloner to thin instances, then deletes this Cloner and returns an array of Cloner meshes. The source meshes are cloned, their clones set enabled.

toThinOriginals() - Converts all Cloner meshes to thin instances from the original meshes, then deletes this Cloner and returns an array of Cloner meshes. Be aware that instances of all those original meshes become disabled as well, so if they are used in other Cloners one may want to use toThin() method instead. If you don’t need animations and so on you may convert Cloner to thin instances. It greatly reduces the number of objects iterating in the render loop.

toMatrix() - Returns an array of matrices (scaling, rotation, position) of the Cloner meshes.

I believe the best solution would be to create NPM package. Still there are some questions: should it be in Babylon.js Extensions directory and would it be possible to use the old documentation with minimal changes?

Meahwhile, have fun with Cloner System!

6 Likes

Looks like Candy Crush :smiley:

1 Like