refs

src/control/index.ts

@@ -22,7 +22,7 @@ const content = /* HTML */ `
 `;
 
 /**
- * A control for change floor layer level on the plugin.
+ * A control for change floor layer level in the plugin.
  * It appears on the map only if you set the `floorControl` option within @type PluginOptions to `true`.
  * @hidden
  * @internal

src/control/types.ts

@@ -1,5 +1,5 @@
 /**
- * Floor level data
+ * Floor level data.
  */
 export interface FloorLevel {
     modelId: string; // id модели этажа или здания
@@ -8,7 +8,7 @@ export interface FloorLevel {
 }
 
 /**
- * Options for the method show
+ * Options for the show method.
  */
 export interface ControlShowOptions {
     buildingModelId: string;
@@ -17,15 +17,15 @@ export interface ControlShowOptions {
 }
 
 /**
- * Event that emitted on button presses of the control
+ * Event that emitted on button presses of the control.
  */
 export interface FloorChangeEvent {
     modelId: string; // id модели этажа или здания
 }
 
 export interface ControlEventTable {
     /**
-     * Emitted when floor's plan was changed
+     * Emitted when floor's plan was changed.
      */
     floorchange: FloorChangeEvent;
 }

src/external/evented.ts

@@ -1,5 +1,5 @@
 /**
- * Event emitter
+ * Event emitter.
  */
 export class Evented<M> {
     private events: { [K in keyof M]?: Array<(ev: M[K]) => void> };
@@ -12,9 +12,10 @@ export class Evented<M> {
     }
 
     /**
-     * Registers event listener
-     * @param type Event type
-     * @param listener Event handler
+     * Registers event listener.
+     *
+     * @param type Event type.
+     * @param listener Event handler.
      */
     public on<K extends keyof M>(type: K, listener: (ev: M[K]) => void): this {
         let eventsByType = this.events[type];
@@ -26,9 +27,10 @@ export class Evented<M> {
     }
 
     /**
-     * Registers event listener which will be called once
-     * @param type Event type
-     * @param listener Event handler
+     * Registers event listener which will be called once.
+     *
+     * @param type Event type.
+     * @param listener Event handler.
      */
     public once<K extends keyof M>(type: K, listener: (ev: M[K]) => void): this {
         const wrapper = (data: M[K]) => {
@@ -42,9 +44,10 @@ export class Evented<M> {
     }
 
     /**
-     * Removes event listener registered with `on`
-     * @param type Event type
-     * @param listener Event handler
+     * Removes event listener registered with `on`.
+     *
+     * @param type Event type.
+     * @param listener Event handler.
      */
     public off<K extends keyof M>(type: K, listener: (ev: M[K]) => void): this {
         const eventsByType = this.events[type];
@@ -63,9 +66,10 @@ export class Evented<M> {
     }
 
     /**
-     * Calls all event listeners with event type `type`
-     * @param type Event type
-     * @param data Data transferred to events
+     * Calls all event listeners with event type `type`.
+     *
+     * @param type Event type.
+     * @param data Data transferred to events.
      */
     public emit<K extends keyof M>(type: K, data?: M[K]): this {
         const eventsByType = this.events[type];

src/labelGroups.ts

@@ -1,6 +1,6 @@
 import type { Map as MapGL, Label } from '@2gis/mapgl/types';
 import type { BuildingState, LabelGroupOptions } from './types/plugin';
-import { GltfPlugin } from './plugin';
+import type { GltfPlugin } from './plugin';
 // import { pluginEvents } from './constants';
 // import { createLabelEvenData } from './utils/events';
 

src/plugin.ts

@@ -33,15 +33,16 @@ export class GltfPlugin extends Evented<GltfPluginEventTable> {
     private models: Map<string, Model>;
     private labelGroups: LabelGroups;
     private realtyScene?: RealtyScene;
+    private isDestroyed = false;
 
     /**
-     * The main class of the plugin
+     * The main class of the plugin.
      *
      * Example:
      * ```js
-     * const plugin = new GltfPlugin (map, {
+     * const plugin = new GltfPlugin(map, {
      *     modelsLoadStrategy: 'waitAll',
-     *     ambientLight: { color: 'white', intencity: 2.5 },
+     *     modelsBaseUrl: 'https://url_to_models',
      * });
      *
      * plugin.addModels([
@@ -54,8 +55,8 @@ export class GltfPlugin extends Evented<GltfPluginEventTable> {
      *     },
      * ]);
      * ```
-     * @param map The map instance
-     * @param pluginOptions GltfPlugin initialization options
+     * @param map The map instance.
+     * @param pluginOptions GltfPlugin initialization options.
      */
     constructor(map: MapGL, pluginOptions?: PluginOptions) {
         super();
@@ -66,7 +67,11 @@ export class GltfPlugin extends Evented<GltfPluginEventTable> {
         this.labelGroups = new LabelGroups(this.map, this);
     }
 
+    /**
+     * Destroys the plugin.
+     */
     public destroy() {
+        this.isDestroyed = true;
         this.models.forEach((model) => {
             model.instance.destroy();
         });
@@ -75,6 +80,11 @@ export class GltfPlugin extends Evented<GltfPluginEventTable> {
         this.realtyScene?.destroy();
     }
 
+    /**
+     * Sets options of the plugin.
+     *
+     * @param pluginOptions Plugin options that are available for setting.
+     */
     public setOptions(pluginOptions: Pick<Required<PluginOptions>, 'groundCoveringColor'>) {
         Object.keys(pluginOptions).forEach((option) => {
             switch (option) {
@@ -87,10 +97,23 @@ export class GltfPlugin extends Evented<GltfPluginEventTable> {
         });
     }
 
+    /**
+     * Adds a model to the map.
+     *
+     * @param modelToLoad Options of a model.
+     * @param hideOnLoad Set to `true` if a model should be hidden on loading completion.
+     */
     public async addModel(modelToLoad: ModelOptions, hideOnLoad = false) {
         return this.addModels([modelToLoad], hideOnLoad ? [] : [modelToLoad.modelId]);
     }
 
+    /**
+     * Adds a list of models to the map.
+     *
+     * @param modelsToLoad An array of options of models.
+     * @param modelIdsToShow An array of ids of models that should be shown. If it's not provided
+     * all models will be shown.
+     */
     public async addModels(modelsToLoad: ModelOptions[], modelIdsToShow?: string[]) {
         const loadingModels = modelsToLoad
             .filter((options) => {
@@ -156,6 +179,10 @@ export class GltfPlugin extends Evented<GltfPluginEventTable> {
             });
 
         return Promise.all(loadingModels).then((loadedModels) => {
+            if (this.isDestroyed) {
+                return;
+            }
+
             if (this.options.modelsLoadStrategy !== 'waitAll') {
                 return;
             }
@@ -168,6 +195,12 @@ export class GltfPlugin extends Evented<GltfPluginEventTable> {
         });
     }
 
+    /**
+     * Returns a current status of a model.
+     * There can be no model or it can be loading or loaded.
+     *
+     * @param id A model id.
+     */
     public getModelStatus(id: string) {
         const model = this.models.get(id);
         if (!model) {
@@ -177,6 +210,11 @@ export class GltfPlugin extends Evented<GltfPluginEventTable> {
         return !model.isLoaded ? ModelStatus.Loading : ModelStatus.Loaded;
     }
 
+    /**
+     * Removes a model from the map.
+     *
+     * @param id A model id.
+     */
     public removeModel(id: string) {
         const model = this.models.get(id);
         if (model) {
@@ -185,39 +223,84 @@ export class GltfPlugin extends Evented<GltfPluginEventTable> {
         }
     }
 
+    /**
+     * Removes models from the map.
+     *
+     * @param id Model ids.
+     */
     public removeModels(ids: string[]) {
         ids.forEach((id) => this.removeModel(id));
     }
 
+    /**
+     * Shows a model on the map.
+     *
+     * @param id A model id.
+     */
     public showModel(id: string) {
         this.models.get(id)?.instance.show();
     }
 
+    /**
+     * Shows models on the map.
+     *
+     * @param id Model ids.
+     */
     public showModels(ids: string[]) {
         ids.forEach((id) => this.showModel(id));
     }
 
+    /**
+     * Hides a model on the map.
+     *
+     * @param id A model id.
+     */
     public hideModel(id: string) {
         this.models.get(id)?.instance.hide();
     }
 
+    /**
+     * Hides models on the map.
+     *
+     * @param id Model ids.
+     */
     public hideModels(ids: string[]) {
         ids.forEach((id) => this.hideModel(id));
     }
 
+    /**
+     * Adds a group of labels to the map.
+     *
+     * @param options Options of the group of labels.
+     * @param state A state of active building and floor a group of labels is associated with.
+     */
     public addLabelGroup(options: LabelGroupOptions, state?: BuildingState) {
         this.labelGroups.add(options, state);
     }
 
+    /**
+     * Removes a group of labels from the map.
+     *
+     * @param id A label group id.
+     */
     public removeLabelGroup(id: string) {
         this.labelGroups.remove(id);
     }
 
+    /**
+     * Adds an interactive realty scene to the map.
+     *
+     * @param scene Options of the scene to add to the map.
+     * @param state A state of building and floor that should be active on realty scene initialization.
+     */
     public async addRealtyScene(scene: BuildingOptions[], state?: BuildingState) {
         this.realtyScene = new RealtyScene(this, this.map, this.options);
         return this.realtyScene.init(scene, state);
     }
 
+    /**
+     * Removes an interactive realty scene from the map.
+     */
     public removeRealtyScene() {
         this.realtyScene?.destroy();
         this.realtyScene = undefined;

src/realtyScene/realtyScene.ts

@@ -42,6 +42,7 @@ export class RealtyScene {
         activeModelId: undefined,
         buildingVisibility: new Map(),
     };
+    private isDestroyed = false;
 
     private groundCoveringSource: GeoJsonSource;
     private control: GltfFloorControl;
@@ -167,6 +168,10 @@ export class RealtyScene {
                 } else {
                     if (modelStatus === ModelStatus.NoModel) {
                         this.plugin.addModel(newModelOptions, true).then(() => {
+                            if (this.isDestroyed) {
+                                return;
+                            }
+
                             if (this.state.activeModelId !== newModelOptions.modelId) {
                                 return;
                             }
@@ -292,6 +297,10 @@ export class RealtyScene {
         return this.plugin
             .addModels(Array.from(modelsToLoad.values()), Array.from(buildingVisibility.keys()))
             .then(() => {
+                if (this.isDestroyed) {
+                    return;
+                }
+
                 this.setState({
                     activeModelId,
                     buildingVisibility,
@@ -315,6 +324,7 @@ export class RealtyScene {
     }
 
     public destroy() {
+        this.isDestroyed = true;
         this.map.off('styleload', this.onStyleLoad);
         this.plugin.off('click', this.onSceneClick);
         this.plugin.off('mouseover', this.onSceneMouseOver);
@@ -367,9 +377,9 @@ export class RealtyScene {
         }
     }
 
-    private onStyleLoad() {
+    private onStyleLoad = () => {
         this.map.addLayer(GROUND_COVERING_LAYER);
-    }
+    };
 
     private onSceneMouseOut = (ev: GltfPluginLabelEvent | GltfPluginModelEvent) => {
         if (ev.target.type !== 'model') {