TomTom Maps SDK for JavaScript
TomTom Maps for JavaScript
    Preparing search index...

    Class Buildings3D

    Draws the base map's buildings in 3D with Three.js, with windows on their facades, a sun or moon that casts shadows on the buildings and the ground, and a look for every standard style.

    Public Preview until the plugin's 1.0.0 release.

    • It extrudes the buildings of the vector tiles the map already loads, and makes no requests of its own.
    • While it shows, it takes the place of the style's own 3D buildings, which it filters out of the 3D - Building layer. It draws whether or not the buildings3D group of the BaseMapModule shows.
    • Its look is a set of knobs, listed in buildings3DKnobCatalogue. Each one you leave unset takes the preset's value. The auto preset follows the map style: the dark street and mono styles light windows from inside under a moon, the others get a sun and glass that mirrors the street and the sky.
    • Walls take the style's 3D building colour of each kind of building until you set walls.color, following the map colours that restyle them.
    • On a map with a Landmarks3D, it leaves out the buildings a landmark replaces and draws the landmarks among its buildings, under its sun and in its shadows, which they cast too. They take its wall colour, opacity and minZoom for their unset knobs. Unless their texture knob says otherwise, their own textures show as facade detail, as strong as facade.intensity. They mirror a little of the street and the sky, as much as reflections.intensity sets.
    • It draws at sea level, so on a 3D terrain hills cover the buildings' lower floors.
    • With roadLabels.occluded or pois.occluded, it moves those style layers under its own, so a building drawn over a label hides it. A hidden POI still keeps other labels off its place, and the moved labels give way to the labels above them where they collide.
    import { Buildings3D } from '@tomtom-org/maps-sdk-plugin-landmarks-3d';

    const buildings = new Buildings3D(map, { facade: { pattern: 'glass' } });
    buildings.updateConfig({ light: { direction: 260, altitude: 15 } }); // a low evening sun
    Index
    constructor
    layer
    applyConfig getConfig isVisible resetConfig setVisible updateConfig

    • Replaces the whole configuration. An empty object has every knob take the auto preset's value.

      Parameters

      Returns void

      Use it, and updateConfig, for a look your code writes: the type is the check, and the values are not checked again. For values held as data, the SDK's setKnobs checks each against buildings3DKnobCatalogue and sets them by id.

    • Returns the knobs set, as a plain serializable copy. The SDK's getKnob reads a knob's value in force, the preset's one when unset.

      Returns Buildings3DConfig

    • Whether the buildings are set to be shown: the visible knob, true unless set.

      Returns boolean

    • Unsets every knob, so the buildings show with the look of the map's style.

      Returns void

    • Shows or hides the buildings. Stored as visible in the configuration. Hidden, they give the style's own 3D buildings their place back.

      Parameters

      • visible: boolean

      Returns void

    • Changes the given knobs and keeps the others, one level deep: a part you pass, such as light, replaces that part's values.

      Parameters

      Returns void

      buildings.updateConfig({ preset: 'streetDark', litWindows: { fraction: 0.6 } });

    Settings
    Member Visibility

    On This Page
    Constructors
    Accessors
    Methods