Kontra​.quadtree(​properties)

Basic Use#

To use a quadtree, you'll first create it using kontra.quadtree(). Then, every frame you'll remove all objects from the quadtree using its clear() function and add all objects back using its add() function. You can add a single object or an array of objects, and as many as you want.

let quadtree = kontra.quadtree();

let player = kontra.sprite({/* ... */});
let enemy = kontra.sprite({/* ... */})

let loop = kontra.gameLoop({
  update: function() {
    quadtree.clear();
    quadtree.add(player, enemy);
  }
});

You should clear the quadtree each frame since the quadtree is only a snapshot of the position of the objects when they were added. Since the quadtree doesn't know anything about those objects, it doesn't know when an object moved or when it should be removed from the tree.

Objects added to the tree must have the properties x, y, width, and height so that their position in the quadtree can be calculated. kontra.sprite defines these properties for you.

When you need to get all objects in the same node as another object, use the quadtrees get() function.

let objects = quadtree.get(player);  //=> [player, enemy]

kontra.quadtree​.add(object[, ...])#

object {object | object[]}

Objects or arrys of objects to add to the quadtree.

Add objects to the quadtree and group them by their position. Can take a single object, a comma separated list of objects, and an array of objects.

let player = kontra.sprite({/* ... */});
let enemy = kontra.sprite({/* ... */});
let bulletPool = kontra.quadtree({
  create: kontra.sprite
});

// create some bullets
for (let i = 0; i < 100; i++) {
  bulletPool.get({/* ... */});
}

let loop = kontra.gameLoop({
  update: function() {
    quadtree.clear();
    quadtree.add(player, enemy, bulletPool.getAliveObjects());
  }
});

kontra.quadtree​.bounds#

{object}

The 2D space (x, y, width, height) the quadtree occupies. The quadtree will never expand past the space and any objects that are outside of the space will not be added to the quadtree.

kontra.quadtree​.clear()#

Removes all objects from the quadtree. You should clear the quadtree every frame before adding all objects back into it.

kontra.quadtree​.get(object)#

object {object}

Object to use for finding other objects.

Get an array of all objects that belong to the same node as the passed in object.

Note: if the passed in object is also part of the quadtree, it will be returned in the results.

let player = kontra.sprite({/* ... */});
let enemy1 = kontra.sprite({/* ... */});
let enemy2 = kontra.sprite({/* .. */});

quadtree.add(player, enemy1, enemy2);
quadtree.get(player);  //=> [player, enemy1]

kontra.quadtree​.maxDepth#

{number}

The maximum node depth of the quadtree. Every time a node splits, the four subnodes it creates go up one in depth. This can keep happening until the depth of a subnode reaches maxDepth.

kontra.quadtree​.maxObjects#

{number}

The maximum number of objects a node can have before it splits.