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
| Property | Type | Description |
|---|---|---|
| id | string | The unique identifier for your terrain. |
| apiKey | string | Your project's Public API Key (pk_...). |
| container | string | CSS selector (e.g., #my-grid). |
| theme | "light" | "dark" | UI theme. Default is light. |
Last updated: April 2026