glTF plugin v2 | MapGL | Urbi Documentation
MapGL JS API

glTF plugin version 2

You can add glTF models to the map using:

  • Style editor and data source: for more details, see the 3D models instruction.
  • glTF plugin version 2. It loads and renders models entirely using the MapGL engine. This allows you to apply various effects to the models that you set in the map style: fog, light, shadows, and others. Using the plugin is most convenient in cases where you need to show multiple models on the map without affecting the base map style.

With the plugin you can:

  • load glTF models on the map
  • show and hide models on the map
  • show POI with information when hovering over a specific model
  • display floor plans

Important

Unlike its first version, the plugin does not use the Three.js library now. To switch from the first version of the plugin to the second one, check the Key changes section.

Using script tag

To use the plugin, add the following line to the page code:

<script src="https://unpkg.com/@2gis/mapgl-gltf@^2/dist/bundle.js"></script>

The main plugin class is available in the mapgl namespace:

const plugin = new mapgl.GltfPlugin(map);

Using npm package

If you use npm, you can include the library using the @2gis/mapgl-gltf package:

npm install @2gis/mapgl-gltf

To initialize the plugin, pass an existing map entity to the plugin constructor:

const plugin = new GltfPlugin(map);

Default values are applied to PluginOptions. To customize the plugin, pass additional options as the second argument:

const plugin = new GltfPlugin(map, {
    hoverOptions: {
        color: '#ff000088',
    },
    labelGroupDefaults: {
        fontSize: 16,
    },
    modelsBaseUrl: 'https://example.com/s3_storage/gltf_models',
    modelsLoadStrategy: 'dontWaitAll',
    floorsControl: {
        position: 'centerLeft',
    },
    groundCoveringColor: '#000000CC',
    zIndex: 5,
});

Where:

  • hoverOptions: options for models in the hover state. Only the color option is available. The default value is #FFFFFF. Color is applied by multiplying all the components.
  • labelGroupDefaults: default values for label groups, unless custom options are specified in LabelGroupOptions:
    • fontSize: font size for labels. Default value is 14.
    • fontColor: font color for labels. Default value is #000000.
    • image: options for the label text background. Applied to the group if the image value in LabelGroupOptions is set as default. Default value:
      {
          url: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOCAyOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB3aWR0aD0iMjgiIGhlaWdodD0iMjgiIHJ4PSI0IiBmaWxsPSIjZWFlYWVhIi8+PHJlY3QgeD0iMSIgeT0iMSIgd2lkdGg9IjI2IiBoZWlnaHQ9IjI2IiByeD0iMyIgZmlsbD0id2hpdGUiLz48L3N2Zz4=',
          size: [38, 38],
          stretchX: [[4, 24]],
          stretchY: [[4, 24]],
          padding: [5, 10, 5, 10],
      }
      
  • modelsBaseUrl: URL to define the relative path of the model. If the model URL is set without http:// or https:// and the domain name, models are loaded relatively to this parameter. The default value is '', so all models are loaded relatively to the web application host.
  • modelsLoadStrategy: strategy of loading and displaying models. Possible values:
    • waitAll: all models are loaded and then displayed on the map simultaneously (default value).
    • dontWaitAll: each model is displayed as soon as it is loaded.
  • floorsControl: options for the UI element with floor buttons in the interactive realty scene. Only the position option is currently available. The default value is centerLeft. See the list of possible values in the ControlPosition.
  • groundCoveringColor: map background color when an underground floor is displayed. The default value is #F8F8EBCC
  • zIndex: order of rendering plugin objects (models, labels) relative to other Objects on the map.

To subscribe to plugin events that occur during interaction with objects (models, labels):

plugin.on('click', (event) => {
    console.log(event);
});

See the list of events that you can subscribe to at GltfPluginEventTable. Depending of which object provokes an event, a GltfPluginModelEvent or a GltfPluginLabelEvent is passed to the handler function.

The process of adding a model to the map involves loading the model and displaying it. The way of displaying models on the map depends on the modelsLoadStrategy option: see the Plugin initialization section.

Note

Instead of manually selecting the model positioning settings (coordinates, rotation, and scale), use the tool for positioning models on the map. You can position the model and copy settings values: see the instruction on placing models on the map.

To add a model to the map, use the addModel method and pass ModelOptions as the first argument (do not set the second argument):

plugin.addModel({
    modelId: 'ea234f1',
    coordinates: [82.8865, 54.9809],
    modelUrl: 'http://example.com/models/model1.glb',
    rotateZ: -15,
    scale: 2,
    interactive: true,
});

To load the model to the cache without displaying it right away, pass the second argument with the true value.

To display the model, use the showModel method and pass the model identifier:

plugin.showModel('ea234f1');

To hide the model on the map, use the hideModel method and pass the model identifier:

plugin.hideModel('ea234f1');

To remove the model from the map and the cache, use the removeModel method:

plugin.removeModel('ea234f1');

To add multiple models to the map, use the addModels method and pass the ModelOptions array as the first argument (do not set the second argument):

const models = [
    {
        modelId: '347da1',
        coordinates: [82.88651, 54.98092],
        modelUrl: 'http://example.com/models/model1.glb',
        rotateZ: 10,
        interactive: true,
    },
    {
        modelId: 'f932d2',
        coordinates: [82.88659, 54.98101],
        modelUrl: 'http://example.com/models/model2.glb',
        scale: 2,
    },
];

plugin.addModels(models);

To load models to the cache and display only some of them, pass an array of models identifiers as the second argument:

plugin.addModels(models, ['347da1']);

To only load models to the cache without displaying them, pass an empty array as the second argument:

plugin.addModels(models, []);

To display models later, use the showModels or showModel methods:

plugin.showModels(['347da1', 'f932d2']);

plugin.showModel('ea234f1');

To hide multiple models from the map, use the hideModels method and pass an array of models identifiers:

plugin.hideModels(['347da1', 'f932d2']);

To remove models from the map and the cache, use the removeModels method:

plugin.removeModels(['347da1', 'f932d2']);

You might need to display a model in place of an object on the map (for example, a building). To hide an object on the map that overlays the model:

  1. Get object identifiers:

    1. Set up logging of object identifiers on click:

      map.on('click', (e) => {
          console.log(e);
      });
      
    2. Open the browser Developer Tools (press F12) and click the objects to be hidden. Copy the identifier from the target.id field of the event, for example:

      {
          "originalEvent": {
              "isTrusted": true
          },
          "lngLat": [82.89980568100268, 54.97787890875184],
          "point": [420, 231],
          "target": {
              "id": "141373143533390"
          },
          "targetData": {
              "type": "default",
              "id": "141373143533390"
          }
      }
      
  2. Pass an array of object identifiers to the linkedIds field of ModelOptions:

    plugin.addModel({
        modelId: 'ea234f1',
        coordinates: [82.8865, 54.9809],
        modelUrl: 'http://example.com/models/model1.glb',
        linkedIds: ['141373143533390'],
    });
    

You can display additional text information on the map using labels or label groups. The labels can be linked to a model or not. Labels can contain any information, such as building characteristics, apartment area, location information on a map, and links.

To add labels to the map, use the addLabelGroup method and pass LabelGroupOptions as an argument:

const labelGroup = {
    id: '722ea9',
    image: 'default',
    minZoom: 17,
    elevation: 30,
    interactive: true,
    labels: [
        {
            coordinates: [82.886554, 54.980988],
            text: '10 sqft',
            userData: {},
        },
        {
            coordinates: [82.8865, 54.9809],
            text: '20 sqft',
            elevation: 33,
            interactive: false,
        },
    ],
};

plugin.addLabelGroup(labelGroup);

Note

Certain options (for example, elevation and interactive) can be set in the LabelOptions of a particular label in a group. In this case, the label value is prioritized over the group value.

To link the label group to a model (for example, a building), pass the model options BuildingState as the second argument:

plugin.addLabelGroup(labelGroup, {
    buildingId: 'ea234f1',
});

To link labels to a building floor, specify the floorId:

plugin.addLabelGroup(labelGroup, {
    buildingId: 'ea234f1',
    floorId: '123456',
});

Options are added to the target field of the plugin event label GltfPluginLabelEvent.

To remove the label group from the map, use the removeLabelGroup method and pass the group identifier as an argument:

plugin.removeLabelGroup('722ea9');

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>2GIS Map API</title>
    <meta name="description" content="glTF plugin example" />
    <style>
        html,
        body,
        #container {
            margin: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
        }
    </style>
</head>

<body>
    <script src="https://mapgl.2gis.com/api/js/v1"></script>
    <script src="https://unpkg.com/@2gis/mapgl-gltf@^2/dist/bundle.js"></script>

    <div id="container"></div>
    <script>
        const map = new mapgl.Map('container', {
            center: [55.270872255787253, 25.196689173834102],
            zoom: 17.9,
            key: 'Your API access key',
            pitch: 45,
            rotation: 330,
            enableTrackResize: true,
            maxZoom: 20.7,
        });

        const plugin = new mapgl.GltfPlugin(map, {
            modelsLoadStrategy: 'dontWaitAll',
            modelsBaseUrl: 'https://disk.2gis.com/digital-twin/models_s3/realty_ads/standpointtowers/',
        });

        plugin
            .addModels([
                {
                    modelId: 'standpointtowers',
                    coordinates: [
                        55.27087225578725,
                        25.196689173834102
                    ],
                    modelUrl: 'standpointtowers_center.glb',
                    rotateZ: -116.76399405643865,
                    linkedIds: ['13933647002592567'],
                    interactive: true,
                },
                {
                    modelId: 'standpointtowers2',
                    coordinates: [
                        55.27087225578725,
                        25.196689173834102
                    ],
                    modelUrl: 'standpointtowers2.glb',
                    rotateZ: -116.76399405643865,
                    linkedIds: ['13933647002601472'],
                    interactive: true,
                },
                {
                    modelId: 'standpointtowers3',
                    coordinates: [
                        55.27087225578725,
                        25.196689173834102
                    ],
                    modelUrl: 'standpointtowers3.glb',
                    rotateZ: -116.76399405643865,                   
                    linkedIds: ['13933647002601471'],
                    interactive: true,
                },
                {
                    modelId: 'standpointtowers6',
                    coordinates: [
                        55.270675867795944,
                        25.19714112613724
                    ],
                    modelUrl: 'standpointtowers6.glb',
                    rotateZ: -122.50752437711678,
                    linkedIds: ['13933647002603034'],
                    interactive: true,
                },
            ]);
    </script>
</body>

</html>

Interactive realty scene allows you to present a building with floor plans and labels that users can interact with (for example, switch floors and see information about separate premises on the floor).

The strategy of displaying models on the map is defined by the modelsLoadStrategy option (see the Plugin initialization section):

  • With the waitAll strategy, all models from the scene configuration (including floor plan models) are loaded simultaneously. This increases the amount of loaded data and the time of displaying the scene on the map. However, switching floor plans happens without delays. All models from the realty scene appear on the map synchronously.
  • With the dontWaitAll strategy, only the main models (including a floor plan if the initial scene state is defined) are loaded. This enables reducing the amount of loaded data and displaying the scene as soon as possible. Models are displayed asynchronously as each model is loaded. During floor plan switching, the target floor is shown with a delay unless it has been loaded before.

Note

To set up an interactive scene using the tool for positioning models, see the Configuring an interactive scene instruction.

At the top hierarchy is a building facade: the main model and its BuildingOptions that contain ModelOptions and additional fields:

  • mapOptions: map options that are applied when the facade becomes active.
  • popupOptions: options of a popup displayed when you hover over the facade.
const facade = {
    modelId: '03a234cb',
    coordinates: [47.245286302641034, 56.134743473834099],
    modelUrl: 'http://example.com/models/model1.glb',
    interactive: true,
    rotateZ: 15,
    scale: 1.2,
    linkedIds: ['70030076555821177'],
    mapOptions: {
        center: [47.24547737708662, 56.134591508663135],
        pitch: 40,
        zoom: 19,
        rotation: -41.4,
    },
    popupOptions: {
        coordinates: [47.24511721603574, 56.13451456056651],
        title: 'Building 1. 11 floors',
        description: 'Dealine: Q4, 2024. <br />15 mins of foot from the Moskovskaya metro station',
    },
};

To add floor plans inside the main model (facade), use the floors option. All floor plan configurations reuse transformations of the parent building models. This means that you do not need to redefine the rotation, scaling, and shift for floor plan models that belong to the same building.

BuildingFloorOptions also contains the following fields:

  • mapOptions: map options that are applied when the floor plan becomes active.
  • text: text in the realty scene control.
  • labelGroups: LabelGroupOptions of the floor plan label group that you can use to display additional information about premises on the floor (for example, define separate groups for apartments on sale and for the sold ones).

Note

Certain options (for example, elevation and interactive) can be set in the LabelOptions of a particular label in a group. In this case, the label value is prioritized over the group value.

const buildingOptions = {
    ...facade,
    floors: [
        {
            id: '235034',
            text: '1-10',
            modelUrl: 'http://example.com/models/model1_floor1.glb',
            mapOptions: {
                center: [47.24524342863023, 56.13449524271827],
                pitch: 40,
                zoom: 20,
                rotation: -57.5,
            },
            labelGroups: [
                {
                    id: '1111',
                    elevation: 5,
                    image: 'default',
                    minZoom: 19.5,
                    fontSize: 12,
                    fontColor: '#3a3a3a',
                    interactive: true,
                    labels: [
                        {
                            coordinates: [47.245048150280994, 56.134470449142164],
                            text: '3 Beds\n78.4 sqft',
                            userData: {
                                url: 'https://docs.urbi.ae',
                            },
                        },
                        {
                            coordinates: [47.24520807647288, 56.13443854463778],
                            text: '2 Beds\n67 sqft',
                            userData: {
                                url: 'https://docs.urbi.ae',
                            },
                        },
                    ],
                },
            ],
        },
    ],
};

Note

Floors must be ordered from the first to the last one in the array.

To display underground floors, set the isUnderground option to true in the BuildingFloorOptions.

When this type of floor plan is displayed, background cover appears and overlaps other objects on the map. Other objects of the interactive scene are hidden and do not overlap the displayed underground floor plan. By default, the background cover color is #F8F8EBCC. To change it, set the custom color in the groundCoveringColor field of the PluginOptions. To change the color on the fly, use the setOptions method (it can be useful when you change the map style).

To add an interactive scene, use the addRealtyScene method. The method automatically configures all required event handlers to ensure proper scene operation:

plugin.addRealtyScene([buildingOptions]);

You can pass the BuildingState as the second argument to define which facade or floor becomes active when the realty scene is added to the map:

plugin.addRealtyScene([buildingOptions], { modelId: '03a234cb', floorId: '235034' });

To hide the interactive scene on the map, use the hideRealtyScene method (loaded models are saved in the cache):

plugin.hideRealtyScene();

To show the scene again, use the showRealtyScene method:

plugin.showRealtyScene();

To remove the interactive scene, use the removeRealtyScene method:

plugin.removeRealtyScene();

Once models are displayed on the map, click one of them to display floor plans.

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>2GIS Map API</title>
    <meta name="description" content="glTF plugin example" />
    <style>
        html,
        body,
        #container {
            margin: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
        }
    </style>
</head>

<body>
    <script src="https://mapgl.2gis.com/api/js/v1"></script>
    <script src="https://unpkg.com/@2gis/mapgl-gltf@^2/dist/bundle.js"></script>

    <div id="container"></div>
    <script>
        const map = new mapgl.Map('container', {
            center: [55.270872255787253, 25.196689173834102],
            zoom: 17.9,
            key: 'Your API access key',
            pitch: 45,
            rotation: 330,
            enableTrackResize: true,
            maxZoom: 20.7,
        });

        const plugin = new mapgl.GltfPlugin(map, {
            modelsLoadStrategy: 'waitAll',
            modelsBaseUrl: 'https://disk.2gis.com/digital-twin/models_s3/realty_ads/standpointtowers/',
            labelGroupDefaults: {
                fontSize: 14,
            },
            hoverOptions: {
                color: '#FFF3F3',
            },
        });

        const realtyScene = [
            {
                modelId: 'standpointtowers',
                coordinates: [
                    55.27087225578725,
                    25.196689173834102
                ],
                rotateZ: -116.76399405643865,
                modelUrl: 'standpointtowers_center.glb',
                linkedIds: ['13933647002592567'],
                interactive: true,
                mapOptions: {
                    center: [55.271321201282895, 25.196442258306178],
                    pitch: 50.4,
                    zoom: 18.52,
                    rotation: -115.7,
                },
            },
            {
                modelId: 'standpointtowers2',
                coordinates: [
                    55.27087225578725,
                    25.196689173834102
                ],
                rotateZ: -116.76399405643865,
                modelUrl: 'standpointtowers2.glb',
                linkedIds: ['13933647002601472'],
                interactive: true,
                mapOptions: {
                    center: [55.27104661856671, 25.19654143333551],
                    pitch: 45,
                    zoom: 19,
                    rotation: -173,
                },
                popupOptions: {
                    coordinates: [55.271024122768324, 25.19693053802895],
                    title: 'Apartments Tower B',
                    description: 'Ready <br> Central A/C & Heating, Security, Concierge Service <br> Private: Garden, Gym, Pool ',
                },
                floors: [
                    {
                        id: '2',
                        text: '2',
                        modelUrl: 'standpointtowers4-2.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 17.8,
                            zoom: 20.8,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 10,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '3',
                        text: '3',
                        modelUrl: 'standpointtowers4-3.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 17.8,
                            zoom: 20.75,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 13,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '4',
                        text: '4',
                        modelUrl: 'standpointtowers4-4.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 14.8,
                            zoom: 20.7,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 16,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '5',
                        text: '5',
                        modelUrl: 'standpointtowers4-5.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 9.3,
                            zoom: 20.65,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 19,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '6',
                        text: '6',
                        modelUrl: 'standpointtowers4-6.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 8.5,
                            zoom: 20.60,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 22,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '7',
                        text: '7',
                        modelUrl: 'standpointtowers4-7.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 8.2,
                            zoom: 20.56,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 24,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '8',
                        text: '8',
                        modelUrl: 'standpointtowers4-8.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 8,
                            zoom: 20.51,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 26,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '9',
                        text: '9',
                        modelUrl: 'standpointtowers4-9.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 8,
                            zoom: 20.4,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 29,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '10',
                        text: '10',
                        modelUrl: 'standpointtowers4-10.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 8,
                            zoom: 20.3,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 31,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '11',
                        text: '11',
                        modelUrl: 'standpointtowers4-11.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 8,
                            zoom: 20.2,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 34,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '12',
                        text: '12',
                        modelUrl: 'standpointtowers4-12.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 7.5,
                            zoom: 20.1,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 36,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '13',
                        text: '13',
                        modelUrl: 'standpointtowers4-13.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 7.0,
                            zoom: 20.1,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 39,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '14',
                        text: '14',
                        modelUrl: 'standpointtowers4-14.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 6.5,
                            zoom: 20.1,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 42,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '15',
                        text: '15',
                        modelUrl: 'standpointtowers4-15.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 6,
                            zoom: 20.1,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 45,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '16',
                        text: '16',
                        modelUrl: 'standpointtowers4-16.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 5.5,
                            zoom: 20.1,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 48,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '17',
                        text: '17',
                        modelUrl: 'standpointtowers4-17.glb',
                        mapOptions: {
                            center: [55.27101659214413, 25.19692572574951],
                            pitch: 5.0,
                            zoom: 20.0,
                            rotation: 137.02588223579758,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 50,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27095943017267, 25.197085861856678],
                                        text: '1 Bed\n323 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271011424317585, 25.19704189077632],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27086972852069, 25.196999662434976],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2711596091742, 25.196857840495],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710044354644, 25.19689784165797],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27109216906766, 25.196807837435273],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27114979328282, 25.196936631205745],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27094029099825, 25.19695530862026],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.271084685746885, 25.196991799213222],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                ],
            },
            {
                modelId: 'standpointtowers3',
                coordinates: [
                    55.27087225578725,
                    25.196689173834102
                ],
                rotateZ: -116.76399405643865,
                modelUrl: 'standpointtowers3.glb',
                linkedIds: ['13933647002601471'],
                interactive: true,
                mapOptions: {
                    center: [55.27125168787015, 25.196926809413966],
                    pitch: 52,
                    zoom: 18.7,
                    rotation: -35.4,
                },
                popupOptions: {
                    coordinates: [55.270872255787253, 25.196689173834102],
                    title: 'Apartments Tower A',
                    description: 'Ready <br> Central A/C & Heating, Security, Concierge Service <br> Private: Garden, Gym, Pool ',
                },
                floors: [
                    {
                        id: '112',
                        text: '1-12',
                        modelUrl: 'standpointtowers5-2_without_transforms.glb',
                        mapOptions: {
                            center: [55.27084419010903, 25.19649935503182],
                            pitch: 9.2,
                            zoom: 19.97,
                            rotation: -12.398906380706755,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 45,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27068175220883, 25.19649320038519],
                                        text: '2 Beds\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27077348188615, 25.19647327785033],
                                        text: '2 Beds\n450 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27085214880376, 25.196467153234963],
                                        text: '2 Beds\n400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27099580986241, 25.196472879809335],
                                        text: '2 Beds\n450 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710647854107, 25.19641925181169],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.270947692821274, 25.19636548566021],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27051955532713, 25.196424192744416],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.270597030613025, 25.196393584814047],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27083715085102, 25.19635404369795],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.270736638337546, 25.196362134415565],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27067601641181, 25.19638678843009],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27102002769878, 25.196363368779487],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                    {
                        id: '1320',
                        text: '13-20',
                        modelUrl: 'standpointtowers5-1.glb',
                        mapOptions: {
                            center: [55.27084419010903, 25.19649935503182],
                            pitch: 9.2,
                            zoom: 19.8,
                            rotation: -12.398906380706755,
                        },
                        labelGroups: [
                            {
                                id: '1111',
                                image: 'default',
                                minZoom: 18.9,
                                elevation: 61,
                                fontSize: 9,
                                fontColor: '#3a3a3a',
                                labels: [
                                    {
                                        coordinates: [55.27068175220883, 25.19649320038519],
                                        text: '2 Beds\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27077348188615, 25.19647327785033],
                                        text: '2 Beds\n450 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27085214880376, 25.196467153234963],
                                        text: '2 Beds\n400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27099580986241, 25.196472879809335],
                                        text: '2 Beds\n450 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.2710647854107, 25.19641925181169],
                                        text: '1 Bed\n360 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.270947692821274, 25.19636548566021],
                                        text: '1 Bed\n330 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27051955532713, 25.196424192744416],
                                        text: '1 Bed\n690 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.270597030613025, 25.196393584814047],
                                        text: '1 Bed\n600 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27083715085102, 25.19635404369795],
                                        text: '4 Beds\n1800 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.270736638337546, 25.196362134415565],
                                        text: '2 Beds\n1500 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27067601641181, 25.19638678843009],
                                        text: '2 Beds\n1215 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                    {
                                        coordinates: [55.27102002769878, 25.196363368779487],
                                        text: '3 Beds\n2400 sqft',
                                        userData: {
                                            url: 'https://dev.urbi.ae/',
                                        },
                                    },
                                ],
                            },
                        ],
                    },
                ],
            },
            {
                modelId: 'standpointtowers6',
                coordinates: [
                    55.270675867795944,
                    25.19714112613724
                ],
                rotateZ: -122.50752437711678,
                modelUrl: 'standpointtowers6.glb',
                linkedIds: ['13933647002603034', '70030076452542637'],
                interactive: true,
                mapOptions: {
                    center: [55.270872255787253, 25.196689173834102],
                    pitch: 40,
                    zoom: 19,
                    rotation: -41.4,
                },
            },
        ];

        plugin.addRealtyScene(realtyScene);
    </script>
</body>

</html>

As the second version of the plugin does not use the ThreeJS library, you need to define rotation and shift parameters and scaling ratio again. For information about model axis directions, see configuring model position.

  • Removed the following options from the PluginOptions interface:

    • dracoScriptsUrl because model loading is now done by the map engine
    • ambientLight because light is set up in map styles now. You can configure them in the Style editor.
  • Replaced the hoverHighlight option with hoverOptions where you can set up the hover state of the model. The color is applied by multiplying each component, so you cannot highlight the model with white color.

  • Replaced the poiConfig option with labelGroupDefaults, which contain default settings for all label groups without division into primary and secondary. In version 1, these types are used to separate labels with and without the background. In version 2, the text background is defined in the label group options. To set a custom background cover, use the image option in the labelGroupDefaults.

// Example of plugin options in version 1
{
    dracoScriptsUrl: 'https://unpkg.com/@2gis/mapgl-gltf@^1/dist/libs/draco/',
    poiConfig: {
        primary: {
            fontSize: 14,
            fontColor: '#000000',
        },
        secondary: {
            fontSize: 14,
            fontColor: '#000000',
        },
    },
    ambientLight: {
        color: '#ffffff',
        intencity: 3,
    },
    hoverHighlight: {
        color: '#ff000088',
        intencity: 0.0,
    },
}

// Same plugin options in version 2
{
    labelGroupDefaults: {
        fontSize: 14,
        fontColor: '#000000',
    },
    hoverOptions: {
        color: '#ff000088',
    },
}
  • Changes in the ModelTarget interface:

    • Made the modelId option mandatory. Now it accepts only the string type.
    • Removed the floorId option.
  • Renamed the PoiTarget interface to LabelTarget:

    • Replaced the type option value with label.
    • Changed the data option to accept the LabelOptions value.
    • Renamed the modelId option to buildingId. Now it accepts only the string type.
    • Changed the floorId option to accept only the string type.
  • Replaced the GltfPluginPoiEvent interface with

  • Removed the addModelsPartially method. Partial adding of models is available in the addModels method:
// Example in version 1
plugin.addModelsPartially(
    [
        {
            modelId: '347da1',
            coordinates: [82.88651, 54.98092],
            modelUrl: 'http://example.com/models/model1.glb',
        },
        {
            modelId: 'f932d2',
            coordinates: [82.88659, 54.98101],
            modelUrl: 'http://example.com/models/model2.glb',
        },
    ],
    ['347da1'],
);

// Same example in version 2
plugin.addModels(
    [
        {
            modelId: '347da1',
            coordinates: [82.88651, 54.98092],
            modelUrl: 'http://example.com/models/model1.glb',
            interactive: true,
        },
        {
            modelId: 'f932d2',
            coordinates: [82.88659, 54.98101],
            modelUrl: 'http://example.com/models/model2.glb',
            interactive: true,
        },
    ],
    ['347da1'],
);
  • Removed the second preserveCache argument from the removeModel and removeModels methods. To hide a model on the map, use the hideModel and hideModels methods:
// Example in version 1
plugin.removeModel('ea234f1', true);
// or
plugin.removeModels(['ea234f1', 'abc354', ..., 'def123'], true);

// Same example in version 2
plugin.hideModel('ea234f1');
// or
plugin.hideModels(['ea234f1', 'abc354', ..., 'def123']);
  • Replaced the addPoiGroup method with addLabelGroup:
// Example in version 1
plugin.addPoiGroup({
    id: '722ea9',
    type: 'primary',
    elevation: 30,
    data: [
        {
            coordinates: [82.886554, 54.980988],
            label: '10 sqft',
        },
    ],
});

plugin.addPoiGroup({
    id: '456qwe',
    type: 'secondary',
    elevation: 33,
    data: [
        {
            coordinates: [82.886, 54.98],
            label: '20 sqft',
        },
    ],
});

// Same example in version 2
plugin.addPoiGroup({
    id: '722ea9',
    image: 'default',
    elevation: 30,
    labels: [
        {
            coordinates: [82.886554, 54.980988],
            text: '10 sqft',
        },
    ],
});

plugin.addPoiGroup({
    id: '456qwe',
    elevation: 33,
    labels: [
        {
            coordinates: [82.886, 54.98],
            text: '20 sqft',
        },
    ],
});
  • Replaced the removePoiGroup method with removeLabelGroup.
  • Removed the preserveCache argument from the removeRealtyScene method. To hide and then show the realty scene, use the hideRealtyScene and showRealtyScene respectively:
// Example in version 1
plugin.removeRealtyScene(true);
plugin.addRealtyScene([ ... ]);

// Same example in version 2
plugin.hideRealtyScene();
plugin.showRealtyScene();
  • Changes in the ModelOptions interface:
    • The modelId option accepts only the string type now.
    • The interactive option contains the false value by default.
// Example in version 1
plugin.addModel({
    modelId: 1234,
    coordinates: [82.8865, 54.9809],
    modelUrl: 'http://example.com/models/model1.glb',
});

// Same example in version 2
plugin.addModel({
    modelId: '1234',
    coordinates: [82.8865, 54.9809],
    modelUrl: 'http://example.com/models/model1.glb',
    interactive: true,
});
  • Changes in the BuildingFloorOptions interface:
    • The id option accepts only the string type now.
    • Renamed the poiGroups option to labelGroups. Now it accepts the LabelGroupOptions array.
  • Renamed the PoiGroupOptions interface to LabelGroupOptions:
    • The id option accepts only the string type now.
    • Removed the type option. Use the image option instead and pass settings of the text background cover in a label group as an argument.
    • Renamed the data option tolabels. Now it accepts the LabelOptions array.
  • Renamed the PoiOptions interface to LabelOptions:
    • Renamed the label option to text.
// Example in version 1
plugin.addRealtyScene([{
    ...,
    floors: [{
        id: 235034,
        text: '1-10',
        modelUrl: 'http://example.com/models/model1_floor1.glb',
        poiGroups: [
            {
                id: 1111,
                type: 'primary',
                elevation: 5,
                data: [{
                    coordinates: [47.245048150280994, 56.134470449142164],
                    label: '3 Beds\n78.4 sqft',
                }],
            },
            {
                id: 2222,
                type: 'secondary',
                elevation: 5,
                data: [{
                    coordinates: [47.2451, 56.1344],
                    label: '2 Beds\n60 sqft',
                }],
            },
        ],
    }],
}]);

// Same example in version 2
plugin.addRealtyScene([{
    ...,
    floors: [{
        id: '235034',
        text: '1-10',
        modelUrl: 'http://example.com/models/model1_floor1.glb',
        labelGroups: [
            {
                id: '1111',
                image: 'default',
                elevation: 5,
                interactive: true,
                labels: [{
                    coordinates: [47.245048150280994, 56.134470449142164],
                    text: '3 Beds\n78.4 sqft',
                }],
            },
            {
                id: '2222',
                elevation: 5,
                interactive: true,
                labels: [{
                    coordinates: [47.2451, 56.1344],
                    text: '2 Beds\n60 sqft',
                }],
            },
        ],
    }],
}]);
  • Changes in the BuildingState interface:
    • Replaced the modelId option with buildingId. Now it accepts only the string type.
    • The floorId option now accepts only the string type.
// Example in version 1
plugin.addPoiGroup({ ... }, {
    modelId: 1111,
    floorId: 2222,
});
// or
plugin.addRealtyScene([ ... ], {
    modelId: 'abc123',
    floorId: 'def456',
});

// Same example in version 2
plugin.addLabelGroup({ ... }, {
    buildingId: '1111',
    floorId: '2222',
});
// or
plugin.addRealtyScene([ ... ], {
    buildingId: 'abc123',
    floorId: 'def456',
});