Package Exports

@pixi/spatial-hash

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@pixi/spatial-hash) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@pixi/spatial-hash - PixiJS Spatial Hash Kit

This package provides an 2D spatial hash implementation. You can use the spatial-hash as standalone or as a system on your renderer.

Standalone usage

If you do not need to hash your entire scene graph, then using a standalone object that is infrequently updated is ideal. This is especially true if you do not render on each tick.

import { SpatialHash } from 'pixi-spatial-hash';

const spatialHash = new SpatialHash(25);
const particleContainer = new Container();

// HINT: Setup your particle container with particles!!!

function updateSpatialHash() {
    spatialHash.reset();

    for (let i = 0; i < particleContainer.children.length; i++)
    {
        spatialHash.add(particleContainer.children[i];)
    }
}

function checkCollision() {
    updateSpatialHash();

    for (let i = 0; i < particleContainer.children.length - 1; i++)
    {
        const particle = particleContainer.children[i];
        const collidedParticles = spatialHash.search(particle.getBounds());// Set<Particle>

        if (collidedParticles.size > 0)
        {
            alert('Particles have collided!');
        }
    }
}

Spatial-hash system usage

If you need a spatial hash over the whole scene graph updated each tick, then the spatial-hash system is the ideal method:

import { SpatialHashSystem } from 'pixi-spatial-hash';
import { Application } from 'pixi.js';

const app = new Application();

document.body.appendChild(app.view);

app.renderer.addSystem(SpatialHashSystem, "spatialHash");   // Install the SpatialHashSystem
app.renderer.spatialHash.addTarget(app.stage);              // Register app.stage as a hashed-target

// Optional: Use a Ticker to update the spatial hash each frame instead. By default, the spatial hash is
// updated on each render call.
app.renderer.spatialHash.setTicker(app.ticker);

// Optional-2: Update the spatial-hash right now! You can then search for any display-objects intersecting with a display-object
// or rectangle bounds.
app.renderer.spatialHash.update();
app.renderer.search(displayObject);