Spawning Objects at Runtime | Wonderland Engine

Very frequently, games or apps add new objects at runtime, maybe as reaction to the user or for spawning a visual effect.

In Wonderland Engine, you can create objects from a custom JavaScript component either using WL.scene.addObject or WL.scene.addObjects.

Add a Single Object

Adding a single object is done via WL.scene.addObject:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
WL.registerComponent('spawner', {
  mesh: {type: WL.Type.Mesh},
  material: {type: WL.Type.Material},
}, {
  start: function() {
    /* Spawn a new object with this.object as parent */
    const o = WL.scene.addObject(this.object);

    /* Attach a mesh */
    o.addComponent('mesh', {
      mesh: this.mesh,
      material: this.material,
    });
  }
});

Add Many Objects

For adding multiple objects, WL.scene.addObjects yields better performance:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
WL.registerComponent('batch-spawner', {
  mesh: {type: WL.Type.Mesh},
  material: {type: WL.Type.Material},
}, {
  start: function() {
    /* Spawn 10 new objects with this.object as parent and
     * let Wonderland Engine know, we will need 10 components (one per object) */
    const objs = WL.scene.addObjects(10, this.object, 10);

    /* Attach meshes */
    for(let o of objs) {
      o.addComponent('mesh', {
        mesh: this.mesh,
        material: this.material,
      });
      o.translate([Math.random()*10, Math.random()*10, Math.random()*10]);
    }
  }
});