SDK Integration

The SLAAAD SDK is a lightweight (4KB gzip) client-side library designed to render real-time occupancy grids in any web environment.

Installation

Add our CDN script to the header of your HTML document.

<script src="https://js.slaaad.com/sdk.js"></script>

Basic Usage

Initialize the terrain by targeting a container element. The SDK handles all WebSocket connections and state management automatically.

const terrain = new Slaaad.Terrain({
  id: "8",               // Your Terrain ID
  apiKey: "pk_...",      // Public API Key
  container: "#grid",     // CSS Selector
  
  // REQUIRED: Handle user image uploads
  onImageUpload: async (file, plotId) => {
    const url = await myApi.upload(file);
    return url; // Return the permanent URL
  }
});

The Image Upload Flow

SLAAAD is headless and does not store user images. When a user occupies a plot, your frontend logic handles the file storage (S3, Cloudinary, or your own server).

01

User Clicks

User selects a vacant plot and chooses an image.

02

SDK Callback

SDK calls your onImageUpload with the File object.

03

Permanent Store

You return the URL; SLAAAD saves the URL reference forever.

Configuration Options

PropertyTypeDescription
idstringThe unique identifier for your terrain.
apiKeystringYour project's Public API Key (pk_...).
containerstringCSS selector (e.g., #my-grid).
theme"light" | "dark"UI theme. Default is light.
Last updated: April 2026