Class __INTERNAL__RendererCore

Generic PubSub class implementing the Publish-Subscribe pattern for event handling.

Hierarchy (View Summary)

  • PubSub<MapEvent>
    • __INTERNAL__RendererCore

Properties

camera: Camera
container: HTMLElement
Debug: Debug
destroy: () => void

Destroys instance and frees resources

getMetersPerPixel: () => number

Returns the current scale of the map in meters per pixel.

getParentContainer: (
    parent?:
        | null
        | string
        | number
        | EntityId<GeometryState>
        | EntityId<GroupContainerState>,
    defaultToScene?: boolean,
) => undefined | GroupContainerObject3D
hideCollisionBoxes: () => void

Hide collision boxes for 2D entities for debugging.

hideOutdoorLayersIntersectingPolygons: (
    polygons: Feature<Polygon | MultiPolygon, any>[],
    layers: string[],
) => void

Filters out layers at a certain point on the outdoor map. This can be used to hide the outdoor building footprint underneath the 3D geometry.

Type declaration

map: undefined | Map$1
off: <EVENT_NAME extends keyof MapEvent>(
    eventName: EVENT_NAME,
    fn: (
        payload: MapEvent[EVENT_NAME] extends { data: null }
            ? any[any]["data"]
            : MapEvent[EVENT_NAME],
    ) => void,
) => void

Unsubscribe a function previously subscribed with on

Type declaration

    • <EVENT_NAME extends keyof MapEvent>(
          eventName: EVENT_NAME,
          fn: (
              payload: MapEvent[EVENT_NAME] extends { data: null }
                  ? any[any]["data"]
                  : MapEvent[EVENT_NAME],
          ) => void,
      ): void
    • Unsubscribe a function previously subscribed with on

      Type Parameters

      • EVENT_NAME extends keyof MapEvent

      Parameters

      • eventName: EVENT_NAME

        An event name to which the provided function was previously subscribed.

      • fn: (
            payload: MapEvent[EVENT_NAME] extends { data: null }
                ? any[any]["data"]
                : MapEvent[EVENT_NAME],
        ) => void

        A function that was previously passed to on. The function must have the same reference as the function that was subscribed.

      Returns void

      // Unsubscribe from the 'click' event
      const handler = (event) => {
      console.log('Map was clicked', event);
      };
      map.off('click', handler);

An event name to which the provided function was previously subscribed.

A function that was previously passed to on. The function must have the same reference as the function that was subscribed.

// Unsubscribe from the 'click' event
const handler = (event) => {
console.log('Map was clicked', event);
};
map.off('click', handler);
on: <EVENT_NAME extends keyof MapEvent>(
    eventName: EVENT_NAME,
    fn: (
        payload: MapEvent[EVENT_NAME] extends { data: null }
            ? any[any]["data"]
            : MapEvent[EVENT_NAME],
    ) => void,
    options?: { signal?: AbortSignal },
) => () => void

Subscribe a function to an event.

Type declaration

    • <EVENT_NAME extends keyof MapEvent>(
          eventName: EVENT_NAME,
          fn: (
              payload: MapEvent[EVENT_NAME] extends { data: null }
                  ? any[any]["data"]
                  : MapEvent[EVENT_NAME],
          ) => void,
          options?: { signal?: AbortSignal },
      ): () => void
    • Subscribe a function to an event.

      Type Parameters

      • EVENT_NAME extends keyof MapEvent

      Parameters

      • eventName: EVENT_NAME

        An event name which, when fired, will call the provided function.

      • fn: (
            payload: MapEvent[EVENT_NAME] extends { data: null }
                ? any[any]["data"]
                : MapEvent[EVENT_NAME],
        ) => void

        A callback that gets called when the corresponding event is fired. The callback will get passed an argument with a type that's one of event payloads.

      • Optionaloptions: { signal?: AbortSignal }

        Optional options object. If a signal is provided, the subscription will be automatically cleaned up when that signal is aborted.

      Returns () => void

      A cleanup function that unsubscribes the event listener when called.

      // Subscribe to the 'click' event
      const handler = (event) => {
      const { coordinate } = event;
      const { latitude, longitude } = coordinate;
      console.log(`Map was clicked at ${latitude}, ${longitude}`);
      };
      map.on('click', handler);

An event name which, when fired, will call the provided function.

A callback that gets called when the corresponding event is fired. The callback will get passed an argument with a type that's one of event payloads.

// Subscribe to the 'click' event
const handler = (event) => {
const { coordinate } = event;
const { latitude, longitude } = coordinate;
console.log(`Map was clicked at ${latitude}, ${longitude}`);
};
map.on('click', handler);
options: Omit<
    Partial<
        {
            __EXPERIMENTAL_shadows?: ShadowsOptions;
            antialias?: boolean;
            attribution?: AttributionControlOptions;
            backgroundAlpha?: number;
            backgroundColor?: string;
            bearing?: number;
            center?: Position;
            environment?: EnvMapOptions;
            gl?: WebGLRenderingContext;
            imagePlacementOptions?: ImagePlacementOptions;
            map?: Map$1;
            mode?: "standalone"
            | "outdoors-interleaved"
            | "outdoors-overlay";
            naturalBearing?: number;
            occlusionEnabled?: boolean;
            onWebGLContextCreationError?: (event: Event) => void;
            onWebGLContextLost?: (event: Event) => void;
            onWebGLContextRestored?: (event: Event) => void;
            onWebGLRendererError?: (error: Error) => void;
            outdoorView: {
                enabled: boolean;
                headers?: { "x-mappedin-tiles-key": string };
                lowDpi?: boolean;
                style?: string;
            };
            outlines?: boolean
            | OutlinesOptions;
            pitch?: number;
            transformImageRequest?: TransformImageRequest;
            useCollisionWorker?: boolean;
            useStandaloneCamera?: boolean;
            useWorkers?: boolean;
            watermark?: WatermarkOptions;
            zoomLevel?: number;
        },
    >,
    "outdoorView",
>
project: (projectVector: Vector3 | Vector2, position: Vector3) => void

Projects a 3D position into screen space.

Type declaration

    • (projectVector: Vector3 | Vector2, position: Vector3): void
    • Parameters

      • projectVector: Vector3 | Vector2

        The vector to store the projected screen coordinates (x, y). If Vector3, z will contain depth from camera.

      • position: Vector3

        The 3D world position to project

      Returns void

projectCoordinateToScreenXY: (coordinate: Position) => { x: number; y: number }

Project a geographic coordinate to a screen coordinate

projectScreenXYToCoordinate: (
    clientX: number,
    clientY: number,
    useWorldPlane?: boolean,
) =>
    | undefined
    | {
        coordinate: Position;
        groupContainers: undefined
        | GroupContainerObject3D[];
    }

Project a clientX/clientY screen coordinate to a geographic coordinate

render: () => undefined | Promise<any>

Perform a render of the scene. This is called internally when something changes, but can be called when adding external models The render happens in an animation frame, not matter how frequently it is called

render

rendererDomElement: HTMLCanvasElement
renderSync: () => Promise<any>

Perform a synchronous render of the scene. This bypasses the animation frame and renders immediately.

Note: Only use this if you have an animation frame setup elsewhere

setBackgroundColor: (color: string, alpha: number) => void

Sets the background color of the renderer. Only applies to "standalone mode"

showCollisionBoxes: () => void

Show collision boxes for 2D entities for debugging. Draws visible bounding rectangles on a transparent overlay canvas.

Accessors

  • get aspect(): number

    Returns number

  • get backgroundAlpha(): number

    Returns the background alpha of the renderer. Only applies to "standalone mode"

    Returns number

  • get backgroundColor(): string

    Returns the background color of the renderer. Only applies to "standalone mode"

    Returns string

  • get cameraObject(): PerspectiveCamera

    The perspective camera used for 3D scene calculations and view-dependent lighting

    Returns PerspectiveCamera

  • get canvasHeight(): number

    Returns number

  • get canvasWidth(): number

    Returns number

  • get mode(): | undefined
    | "standalone"
    | "outdoors-interleaved"
    | "outdoors-overlay"

    Returns the mode the Renderer is in.

    Returns undefined | "standalone" | "outdoors-interleaved" | "outdoors-overlay"

  • get resolutionScale(): number

    Returns pixel ratio of the renderer

    Returns number

  • get signal(): AbortSignal

    Returns the AbortSignal for this PubSub instance. Use this signal with APIs that support cancellation (fetch, addEventListener, etc.) When the PubSub is destroyed, the signal will be aborted and all listeners using it will be automatically removed.

    Returns AbortSignal

    // Automatically cleaned up when PubSub is destroyed
    pubsub.addEventListener(window, 'resize', handler, { signal: pubsub.signal });
  • get viewCamera(): Camera

    The view camera is used for projecting both the outdoor map and our scene

    Returns Camera

Methods

  • Add a custom THREE.js entity to the map. The geometry is placed at the GeoJSON coordinate and includes a setup and update methods. Setup is called when the first time the geometry visible, and update is called every render frame.

    Parameters

    • id: string
    • feature: Feature<Point>
    • builder: CustomGeometryBuilder
    • Optionalstyle: { altitude?: number; interactive?: boolean; visible?: boolean }
    • Optionalparent: null | string | number | EntityId<GroupContainerState>

    Returns EntityId<ShapeState>

  • Add a container that can hold other containers, geometry groups, markers, labels and paths. Use this to group entities together.

    Parameters

    • id: string
    • Optionaloptions: {
          altitude?: number;
          focusable?: boolean;
          interactive?: boolean;
          preloadGeometry?: boolean;
          visible?: boolean;
      }
    • Optionalparent: null | string | number | EntityId<GroupContainerState>

    Returns EntityId<GroupContainerState>

  • Parameters

    • id: string
    • geometry: Feature<Point, ImageProperties>
    • style: ImageStyle
    • Optionalparent: null | string | EntityId<GroupContainerState>

    Returns undefined | EntityId<ImageState>

  • Add a 2D label at a GeoJSON coordinate.

    Parameters

    • coordinate: Position
    • text: string
    • Optionaloptions: AddLabelOptionsInternal
    • Optionalparent: null | string | EntityId<GroupContainerState>

    Returns undefined | EntityId<LabelState>

  • Add an HTML Marker at a GeoJSON coordinate.

    Parameters

    • coordinate: Position
    • contentHTML: string
    • Optionaloptions: AddMarkerOptions
    • Optionalparent: null | string | number | EntityId<GroupContainerState>

    Returns undefined | EntityId<MarkerState>

  • Add a group of models from GeoJSON data. These will be instanced automatically for better performance.

    Parameters

    Returns undefined | EntityId<FeatureCollectionState>

  • Type Parameters

    Parameters

    • feature: T
    • Optionalparent: null | string | number | EntityId<GroupContainerState>

    Returns number

  • Add a Path along a set of GeoJSON coordinates that can be animated.

    Parameters

    • geometry: FeatureCollection<Point, PathProperties>
    • Optionaloptions: AddPathOptions
    • Optionalparent: null | string | EntityId<GroupContainerState>

    Returns undefined | EntityId<PathState>

  • Parameters

    • id: string
    • geometry: Feature<Point, FloatingFloorTextProperties>
    • options: AddText3DOptions
    • Optionalparent: null | string | EntityId<GroupContainerState>

    Returns EntityId<Text3DState>

  • Parameters

    • lowerContainer: GroupContainerObject3D
    • upperContainer: GroupContainerObject3D
    • Optionaldebug: boolean

    Returns number

  • Convert a GeoJSON position to a 3D map position.

    Parameters

    • position: Position

      The GeoJSON position to convert.

    • Optionalvector: Vector3

      Optional vector to copy the result into instead of creating a new vector.

    Returns Vector3

    The converted 3D map position.

  • Convert latitude and longitude to a 3D map position.

    Parameters

    • latitude: number

      The latitude to convert.

    • longitude: number

      The longitude to convert.

    • Optionalaltitude: number

      Optional altitude to include in the conversion. Defaults to 0.

    • Optionalvector: Vector3

      Optional vector to copy the result into instead of creating a new vector.

    Returns Vector3

    The converted 3D map position.

  • Gets the bounding area (4 corners) in lon,lat of a geometry, geomrtry group, or group container. This can be used with Camera to focus on an entity

    Parameters

    • OptionalgeometryOrGeometryId: string | number | EntityId<EntityState>

    Returns undefined | Position[]

  • Get the center of a geometry or bounding box.

    Parameters

    • geometryOrBoundingBox: string | number | Position[] | EntityId<EntityState>

      Geometry, geometry id, or bounding box to get the center of.

    Returns undefined | [number, number]

  • Get the current scene as a GLB file

    Parameters

    • options: GLTFExportOptions

    Returns Promise<Blob>

  • Returns Group

  • Get rendered state for an entity (e.g., runtime rendering state that changes frequently)

    Parameters

    • entity: string | number | EntityId<LabelState>

      The entity to get rendered state for

    Returns undefined | LabelRenderedState

    Object with all available rendered state properties, or undefined if not found

  • Recursively get the state for the whole scene. Can be an expensive operation.

    Returns GroupContainerState

  • Get the current state of the map view, or any entity that was added, regardless of whether it is visible in the scene

    Returns MapViewState

  • Get the current state of the map view, or any entity that was added, regardless of whether it is visible in the scene

    Type Parameters

    • T extends EntityId<EntityState>

    Parameters

    • geometryOrGeometryId: T

    Returns T extends EntityId<LabelState>
        ? LabelState
        : T extends EntityId<GeometryState>
            ? GeometryState
            : T extends EntityId<MarkerState>
                ? MarkerState
                : T extends EntityId<FeatureCollectionState>
                    ? FeatureCollectionState
                    : T extends EntityId<GroupContainerState>
                        ? GroupContainerState
                        : T extends EntityId<ModelState>
                            ? ModelState
                            : T extends EntityId<PathState>
                                ? PathState
                                : T extends EntityId<ShapeState>
                                    ? ShapeState
                                    : T extends EntityId<ImageState>
                                        ? ImageState
                                        : T extends EntityId<(...)> ? Text3DState : EntityState

  • Get the current state of the map view, or any entity that was added, regardless of whether it is visible in the scene

    Parameters

    • OptionalgeometryOrGeometryId: string | number | Record<string | number, any>

    Returns EntityState

  • Get the current state of the map view, or any entity that was added, regardless of whether it is visible in the scene

    Type Parameters

    • T extends EntityState

    Parameters

    • geometryOrGeometryId: T["id"]

    Returns T extends LabelState
        ? LabelState
        : T extends GeometryState
            ? GeometryState
            : T extends MarkerState
                ? MarkerState
                : T extends FeatureCollectionState
                    ? FeatureCollectionState
                    : T extends GroupContainerState
                        ? GroupContainerState
                        : T extends ModelState
                            ? ModelState
                            : T extends PathState
                                ? PathState
                                : T extends ShapeState
                                    ? ShapeState
                                    : T extends ImageState ? ImageState : EntityState

  • Returns PerspectiveCamera

  • internal

    Returns Renderer

  • Returns undefined | Scene

  • Check if the state for a given geometry or geometry id exists

    Parameters

    • geometryOrGeometryId: string | number | EntityId<EntityState>

      The geometry or geometry id to check

    Returns boolean

    True if the state exists, false otherwise

  • Checks if the given entity is within the current camera's view frustum. This method is useful for determining if an entity is visible on the screen.

    Parameters

    • target:
          | string
          | EntityState
          | {
              id: string
              | number;
              type:
                  | "label"
                  | "marker"
                  | "model"
                  | "path"
                  | "geometry"
                  | "text3d"
                  | "feature-collection"
                  | "group-container"
                  | "image"
                  | "custom-geometry";
          }

      The entity to check. This can be an object with id and type properties, a string representing the entity's ID, or an entity state object.

    Returns boolean

    • Returns true if the entity is within the camera's view, otherwise false.
  • Labels an existing 3D geometry with a text area.

    Parameters

    • meshGeometryId: string

      The ID of the target 3D geometry to label.

    • content: string

      The text content to display.

    • Optionaloptions: AddText3DOptions & { parentId?: string }

      Additional options for adding the text label, including:

      • parentId: Optional ID of the parent container.
      • appearance: Optional appearance settings for the text label.

    Returns undefined | EntityId<Text3DState>

    An object containing the ID and type of the created or existing text label, or undefined if labeling failed. If geometry is already labeld, the same text id will be returned

    const label = renderer.labelText3D('geometry123', 'Hello World', { parentId: 'parent456', appearance: { color: 'red' } });
    if (label) {
    console.log(`Label created with ID: ${label.id}`);
  • Remove a MapLibre event listener

    Parameters

    • event: LiteralUnion<keyof MapEventType, string>
    • handler: (...args: any[]) => void

    Returns void

  • Subscribe a function to be called when the signal is aborted.

    Type Parameters

    • T extends (...args: any[]) => void

    Parameters

    • fn: T

      The function to call when the signal is aborted.

    Returns void

  • Register a MapLibre event listener

    Parameters

    • event: LiteralUnion<keyof MapEventType, string>
    • handler: (...args: any[]) => void

    Returns void

  • Return a list of Geometry2D IDs currently rendered on screen.

    Parameters

    • Optionaloptions: { fullyContains?: boolean; screenOffsets?: Partial<InsetPadding> }

      The options to query.

      • OptionalfullyContains?: boolean

        Whether to exclude entities that intersect with the screen edges after accounting for offsets.

      • OptionalscreenOffsets?: Partial<InsetPadding>

        Optional offsets to account for on the edges of the screen.

    Returns string[]

    A list of IDs.

  • Remove an entity from the renderer and release associated resources.

    Parameters

    • object: string | number

    Returns void

  • Remove an entity from the renderer and release associated resources.

    Parameters

    • object: EntityTypes

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Parameters

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<LabelState>

    Parameters

    • object: T | T["id"]
    • state: Partial<LabelState>

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<MarkerState>

    Parameters

    • object: T | T["id"]
    • state: Partial<MarkerStateUpdate>

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<FeatureCollectionState>

    Parameters

    • object: T | T["id"]
    • state: Partial<FeatureCollectionState>

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<GroupContainerState>

    Parameters

    • object: T | T["id"]
    • state: Partial<GroupContainerState>

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<GeometryState>

    Parameters

    • object: T | T["id"]
    • state: Partial<GeometryState>

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<ShapeState>

    Parameters

    • object: T | T["id"]
    • state: Partial<ShapeState>

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<PathState>

    Parameters

    • object: T | T["id"]
    • state: PathUpdateState

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<ModelState>

    Parameters

    • object: T | T["id"]
    • state: Partial<UpdateModelState>

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<ImageState>

    Parameters

    • object: T | T["id"]
    • state: Partial<ImageState>

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<Text3DState>

    Parameters

    • object: T | T["id"]
    • state: Partial<UpdatableText3DState>

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityId<PathState>

    Parameters

    Returns void

  • Set the state of the map view or any entity that was added, regardless of whether it is visible in the scene.

    Type Parameters

    • T extends EntityState

    Parameters

    Returns void

  • Updates the watermark on the map.

    Parameters

    • options: WatermarkUpdateOptions

      {WatermarkUpdateOptions}

    Returns void