or run

npx @tessl/cli init

Version

Tile

Overview

Evals

Files

docs

configuration.md index.md json-conversion.md transport.md

tile.json

Configuration Management

Configuration system for managing available classes, functions, constants, and conversion settings for JSON to JavaScript object conversion.

Capabilities

JSONConfiguration Class

Configuration manager that defines available classes, functions, constants, enums, and conversion behavior.

/**
 * Configuration manager for JSON conversion settings
 */
class JSONConfiguration {
  /** Key used to identify class types in JSON (default: '@@type') */
  typeKey: string;
  
  /** Key used to identify function objects in JSON (default: '@@function') */
  functionKey: string;
  
  /** Registry of available classes for instantiation */
  classes: Record<string, any>;
  
  /** Registry of React components for JSX creation */
  reactComponents: Record<string, any>;
  
  /** Registry of enum values for constant resolution */
  enumerations: Record<string, any>;
  
  /** Registry of constant values for constant resolution */
  constants: Record<string, any>;
  
  /** Registry of available functions for function objects */
  functions: Record<string, Function>;
  
  /** React instance for creating React components */
  React: any;
  
  /** Function for converting expression strings to functions */
  convertFunction: (propValue: string, configuration: JSONConfiguration) => Function;
  
  /** Hook for preprocessing class props before instantiation */
  preProcessClassProps: (Class: any, props: any, configuration?: JSONConfiguration) => any;
  
  /** Hook for post-processing converted JSON */
  postProcessConvertedJson: (json: any) => any;
  
  /** Logger instance for warnings and errors */
  log: any;
  
  /**
   * Creates a new configuration by merging provided configurations
   * @param configurations - Configuration objects to merge
   */
  constructor(...configurations: any[]);
  
  /**
   * Merges a configuration object into this configuration
   * @param configuration - Configuration object to merge
   */
  merge(configuration: any): void;
  
  /**
   * Validates the configuration object
   * @param configuration - Configuration to validate
   * @returns True if valid
   */
  validate(configuration: any): boolean;
}

Usage Examples:

import { JSONConfiguration } from "@deck.gl/json";
import { ScatterplotLayer, HeatmapLayer } from "@deck.gl/layers";
import { MapView, OrbitView } from "@deck.gl/core";
import { COORDINATE_SYSTEM } from "@deck.gl/core";

// Basic configuration
const config = new JSONConfiguration({
  classes: {
    ScatterplotLayer,
    HeatmapLayer,
    MapView,
    OrbitView
  },
  enumerations: {
    COORDINATE_SYSTEM
  },
  constants: {
    DEFAULT_RADIUS: 100,
    DEFAULT_COLOR: [255, 0, 0]
  }
});

// Configuration with custom functions
const configWithFunctions = new JSONConfiguration({
  classes: { ScatterplotLayer },
  functions: {
    calculateRadius: (props) => props.base * props.multiplier,
    generateColor: (props) => [props.r, props.g, props.b]
  }
});

// Multiple configuration merging
const baseConfig = new JSONConfiguration({
  classes: { ScatterplotLayer }
});

const extendedConfig = new JSONConfiguration(
  baseConfig,
  {
    classes: { HeatmapLayer },
    constants: { MY_CONSTANT: 42 }
  }
);

// Runtime configuration merging
config.merge({
  constants: {
    NEW_CONSTANT: "value"
  }
});

Configuration Properties

Classes Registry

Maps string identifiers to JavaScript classes for instantiation:

{
  classes: {
    "ScatterplotLayer": ScatterplotLayer,
    "HeatmapLayer": HeatmapLayer
  }
}

// Enables JSON like:
{
  "@@type": "ScatterplotLayer",
  "id": "my-layer"
}

Enumerations Registry

Maps enum names and values for constant resolution:

{
  enumerations: {
    "COORDINATE_SYSTEM": {
      "DEFAULT": 0,
      "LNGLAT": 1,
      "METER_OFFSETS": 2
    }
  }
}

// Enables JSON like:
{
  "coordinateSystem": "@@#COORDINATE_SYSTEM.DEFAULT"
}

Constants Registry

Maps constant names to values:

{
  constants: {
    "DEFAULT_RADIUS": 100,
    "PRIMARY_COLOR": [255, 0, 0]
  }
}

// Enables JSON like:
{
  "radius": "@@#DEFAULT_RADIUS",
  "color": "@@#PRIMARY_COLOR"
}

Functions Registry

Maps function names to executable functions:

{
  functions: {
    "calculateRadius": (props) => props.base * props.multiplier,
    "formatLabel": (props) => `${props.prefix}: ${props.value}`
  }
}

// Enables JSON like:
{
  "@@function": "calculateRadius",
  "base": 10,
  "multiplier": 2
}

React Components Registry

Maps component names to React components for JSX creation:

{
  reactComponents: {
    "CustomTooltip": CustomTooltipComponent
  },
  React: React // React instance required
}

Configuration Hooks

Pre-processing Hook

Modify class properties before instantiation:

const config = new JSONConfiguration({
  classes: { ScatterplotLayer },
  preProcessClassProps: (Class, props, configuration) => {
    // Add default properties
    if (Class === ScatterplotLayer && !props.radiusScale) {
      props.radiusScale = 1;
    }
    return props;
  }
});

Post-processing Hook

Modify the final converted result:

const config = new JSONConfiguration({
  classes: { ScatterplotLayer },
  postProcessConvertedJson: (json) => {
    // Add metadata to all layer objects
    if (json.layers) {
      json.layers.forEach(layer => {
        layer._metadata = { convertedAt: Date.now() };
      });
    }
    return json;
  }
});

Custom Function Conversion

Override default expression parsing:

import customExpressionParser from './my-parser';

const config = new JSONConfiguration({
  convertFunction: customExpressionParser
});

Validation

The configuration validates:

typeKey is a string
classes is an object
All required properties are present

Legacy Support

For backwards compatibility, the configuration accepts deprecated properties:

{
  // DEPRECATED: Use 'classes' instead
  layers: { ScatterplotLayer },
  views: { MapView }
}

These are automatically merged into the classes registry.