@panoramax/web-viewer 3.2.3 → 4.0.0-develop-9f9cf858

package/docs/reference/components/ui/Map.md

@@ -0,0 +1,239 @@
+<a name="Panoramax.components.ui.Map"></a>
+
+## Panoramax.components.ui.Map ⇐ <code>[maplibregl.Map](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/)</code>
+**Kind**: static class of <code>Panoramax.components.ui</code>  
+**Extends**: <code>[maplibregl.Map](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/)</code>  
+**Emits**: [<code>background-changed</code>](#Panoramax.components.ui.Map+event_background-changed), [<code>users-changed</code>](#Panoramax.components.ui.Map+event_users-changed), [<code>sequence-hover</code>](#Panoramax.components.ui.Map+event_sequence-hover), [<code>sequence-click</code>](#Panoramax.components.ui.Map+event_sequence-click), [<code>picture-click</code>](#Panoramax.components.ui.Map+event_picture-click), [<code>ready</code>](#Panoramax.components.ui.Map+event_ready)  
+
+* [.Map](#Panoramax.components.ui.Map) ⇐ <code>[maplibregl.Map](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/)</code>
+    * [new Map(parent, container, [options])](#new_Panoramax.components.ui.Map_new)
+    * [.destroy()](#Panoramax.components.ui.Map+destroy)
+    * [.waitForEnoughMapLoaded()](#Panoramax.components.ui.Map+waitForEnoughMapLoaded) ⇒ <code>Promise</code>
+    * [.reloadVectorTiles()](#Panoramax.components.ui.Map+reloadVectorTiles)
+    * [.hasTwoBackgrounds()](#Panoramax.components.ui.Map+hasTwoBackgrounds) ⇒ <code>boolean</code>
+    * [.getBackground()](#Panoramax.components.ui.Map+getBackground) ⇒ <code>string</code>
+    * [.setBackground(bg)](#Panoramax.components.ui.Map+setBackground)
+    * [.getVisibleUsers()](#Panoramax.components.ui.Map+getVisibleUsers) ⇒ <code>Array.&lt;string&gt;</code>
+    * [.setVisibleUsers(visibleIds)](#Panoramax.components.ui.Map+setVisibleUsers)
+    * [.filterUserLayersContent(dataType, filter)](#Panoramax.components.ui.Map+filterUserLayersContent)
+    * [.displayPictureMarker(lon, lat, heading, [skipCenter])](#Panoramax.components.ui.Map+displayPictureMarker)
+    * [.reloadLayersStyles()](#Panoramax.components.ui.Map+reloadLayersStyles)
+    * [.addEventListener(type, listener)](#Panoramax.components.ui.Map+addEventListener)
+    * ["ready"](#Panoramax.components.ui.Map+event_ready)
+    * ["background-changed"](#Panoramax.components.ui.Map+event_background-changed)
+    * ["users-changed"](#Panoramax.components.ui.Map+event_users-changed)
+    * ["sequence-hover"](#Panoramax.components.ui.Map+event_sequence-hover)
+    * ["sequence-click"](#Panoramax.components.ui.Map+event_sequence-click)
+    * ["picture-click"](#Panoramax.components.ui.Map+event_picture-click)
+
+<a name="new_Panoramax.components.ui.Map_new"></a>
+
+### new Map(parent, container, [options])
+Map is the component showing pictures and sequences geolocation.
+
+Note that all functions of [MapLibre GL JS class Map](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/) are also available.
+
+A more complete version of Map (with filters & themes) is available through [MapMore class](MapMore.md/#Panoramax.components.ui.MapMore)
+
+⚠️ This class doesn't inherit from [EventTarget](https://developer.mozilla.org/fr/docs/Web/API/EventTarget), so it doesn't have `addEventListener` and `dispatchEvent` functions.
+It uses instead [`on`](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#on) and `fire` functions from MapLibre Map class.
+`fire` function doesn't take directly [`Event`](https://developer.mozilla.org/fr/docs/Web/API/Event) objects, but a string and object data.
+A shorthand `addEventListener` function is added for simpler usage.
+
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| parent | [<code>Basic</code>](../core/Basic.md/#Panoramax.components.core.Basic) |  | The parent view |
+| container | <code>Element</code> |  | The DOM element to create into |
+| [options] | <code>object</code> |  | The map options (any of [MapLibre GL settings](https://maplibre.org/maplibre-gl-js/docs/API/type-aliases/MapOptions/) or any supplementary option defined here) |
+| [options.raster] | <code>object</code> |  | The MapLibre raster source for aerial background. This must be a JSON object following [MapLibre raster source definition](https://maplibre.org/maplibre-style-spec/sources/#raster). |
+| [options.background] | <code>string</code> | <code>&quot;streets&quot;</code> | Choose default map background to display (streets or aerial, if raster aerial background available). Defaults to street. |
+| [options.attributionControl.customAttribution] | <code>string</code> |  | To override default map attribution. |
+
+**Example**  
+```js
+const map = new Panoramax.components.ui.Map(viewer, mapNode, {center: {lat: 48.7, lng: -1.7}});
+```
+<a name="Panoramax.components.ui.Map+destroy"></a>
+
+### map.destroy()
+Destroy any form of life in this component
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+<a name="Panoramax.components.ui.Map+waitForEnoughMapLoaded"></a>
+
+### map.waitForEnoughMapLoaded() ⇒ <code>Promise</code>
+Helper to know when enough map background and Panoramax tiles are loaded for a proper display.
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+**Returns**: <code>Promise</code> - Resolves when enough is loaded  
+<a name="Panoramax.components.ui.Map+reloadVectorTiles"></a>
+
+### map.reloadVectorTiles()
+Force refresh of vector tiles data
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+<a name="Panoramax.components.ui.Map+hasTwoBackgrounds"></a>
+
+### map.hasTwoBackgrounds() ⇒ <code>boolean</code>
+Check if map offers aerial imagery as well as streets rendering.
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+**Returns**: <code>boolean</code> - True if aerial imagery is available for display  
+<a name="Panoramax.components.ui.Map+getBackground"></a>
+
+### map.getBackground() ⇒ <code>string</code>
+Get the currently selected map background
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+**Returns**: <code>string</code> - aerial or streets  
+<a name="Panoramax.components.ui.Map+setBackground"></a>
+
+### map.setBackground(bg)
+Change the shown background in map.
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+**Throws**:
+
+- <code>Error</code> If not aerial imagery is available
+
+
+| Param | Type | Description |
+| --- | --- | --- |
+| bg | <code>string</code> | The new background to display (aerial or streets) |
+
+<a name="Panoramax.components.ui.Map+getVisibleUsers"></a>
+
+### map.getVisibleUsers() ⇒ <code>Array.&lt;string&gt;</code>
+Get the currently visible users
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+**Returns**: <code>Array.&lt;string&gt;</code> - List of visible users  
+<a name="Panoramax.components.ui.Map+setVisibleUsers"></a>
+
+### map.setVisibleUsers(visibleIds)
+Make given user layers visible on map, and hide all others (if any)
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| visibleIds | <code>string</code> \| <code>Array.&lt;string&gt;</code> | The user layers IDs to display |
+
+<a name="Panoramax.components.ui.Map+filterUserLayersContent"></a>
+
+### map.filterUserLayersContent(dataType, filter)
+Filter the visible data content in all visible map layers
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| dataType | <code>string</code> | sequences or pictures |
+| filter | <code>object</code> | The MapLibre GL filter rule to apply |
+
+<a name="Panoramax.components.ui.Map+displayPictureMarker"></a>
+
+### map.displayPictureMarker(lon, lat, heading, [skipCenter])
+Shows on map a picture position and heading.
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| lon | <code>number</code> |  | The longitude |
+| lat | <code>number</code> |  | The latitude |
+| heading | <code>number</code> |  | The heading |
+| [skipCenter] | <code>boolean</code> | <code>false</code> | Set to true to avoid map centering on marker |
+
+<a name="Panoramax.components.ui.Map+reloadLayersStyles"></a>
+
+### map.reloadLayersStyles()
+Forces reload of pictures/sequences layer styles.
+This is useful after a map theme change.
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+<a name="Panoramax.components.ui.Map+addEventListener"></a>
+
+### map.addEventListener(type, listener)
+Listen to map events.
+This is a binder to [`on`](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#on) and [`once`](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#once) MapLibre GL functions.
+
+**Kind**: instance method of [<code>Map</code>](#Panoramax.components.ui.Map)  
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| type | <code>string</code> |  | The event type to listen for |
+| listener | <code>function</code> |  | The event handler |
+| [options.once] | <code>boolean</code> | <code>false</code> | Set to true to only listen to first event. |
+
+<a name="Panoramax.components.ui.Map+event_ready"></a>
+
+### "ready"
+Event when map is ready to display.
+This includes Maplibre initial load, enough map data display and styling.
+
+**Kind**: event emitted by [<code>Map</code>](#Panoramax.components.ui.Map)  
+<a name="Panoramax.components.ui.Map+event_background-changed"></a>
+
+### "background-changed"
+Event for map background changes
+
+**Kind**: event emitted by [<code>Map</code>](#Panoramax.components.ui.Map)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| [background] | <code>string</code> | The new selected background (aerial, streets) |
+
+<a name="Panoramax.components.ui.Map+event_users-changed"></a>
+
+### "users-changed"
+Event for visible users changes
+
+**Kind**: event emitted by [<code>Map</code>](#Panoramax.components.ui.Map)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| [usersIds] | <code>Array.&lt;string&gt;</code> | The list of newly selected users |
+
+<a name="Panoramax.components.ui.Map+event_sequence-hover"></a>
+
+### "sequence-hover"
+Event when a sequence on map is hovered (not selected)
+
+**Kind**: event emitted by [<code>Map</code>](#Panoramax.components.ui.Map)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| seqId | <code>string</code> | The hovered sequence ID |
+
+<a name="Panoramax.components.ui.Map+event_sequence-click"></a>
+
+### "sequence-click"
+Event when a sequence on map is clicked
+
+**Kind**: event emitted by [<code>Map</code>](#Panoramax.components.ui.Map)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| seqId | <code>string</code> | The clicked sequence ID |
+| coordinates | <code>maplibregl.LngLat</code> | The coordinates of user click |
+
+<a name="Panoramax.components.ui.Map+event_picture-click"></a>
+
+### "picture-click"
+Event when a picture on map is clicked
+
+**Kind**: event emitted by [<code>Map</code>](#Panoramax.components.ui.Map)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| picId | <code>string</code> | The clicked picture ID |
+| seqId | <code>string</code> | The clicked picture's sequence ID |
+| feature | <code>object</code> | The GeoJSON feature of the picture |
+

package/docs/reference/components/ui/MapMore.md

@@ -0,0 +1,256 @@
+<a name="Panoramax.components.ui.MapMore"></a>
+
+## Panoramax.components.ui.MapMore ⇐ [<code>Map</code>](Map.md/#Panoramax.components.ui.Map)
+**Kind**: static class of <code>Panoramax.components.ui</code>  
+**Extends**: [<code>Map</code>](Map.md/#Panoramax.components.ui.Map)  
+**Emits**: [<code>background-changed</code>](Map.md/#Panoramax.components.ui.Map+event_background-changed), [<code>users-changed</code>](Map.md/#Panoramax.components.ui.Map+event_users-changed), [<code>sequence-hover</code>](Map.md/#Panoramax.components.ui.Map+event_sequence-hover), [<code>sequence-click</code>](Map.md/#Panoramax.components.ui.Map+event_sequence-click), [<code>picture-click</code>](Map.md/#Panoramax.components.ui.Map+event_picture-click), [<code>filters-changed</code>](#Panoramax.components.ui.MapMore+event_filters-changed)  
+
+* [.MapMore](#Panoramax.components.ui.MapMore) ⇐ [<code>Map</code>](Map.md/#Panoramax.components.ui.Map)
+    * [new MapMore(parent, container, [options])](#new_Panoramax.components.ui.MapMore_new)
+    * [.destroy()](Map.md/#Panoramax.components.ui.Map+destroy)
+    * [.waitForEnoughMapLoaded()](Map.md/#Panoramax.components.ui.Map+waitForEnoughMapLoaded) ⇒ <code>Promise</code>
+    * [.reloadVectorTiles()](Map.md/#Panoramax.components.ui.Map+reloadVectorTiles)
+    * [.hasTwoBackgrounds()](Map.md/#Panoramax.components.ui.Map+hasTwoBackgrounds) ⇒ <code>boolean</code>
+    * [.getBackground()](Map.md/#Panoramax.components.ui.Map+getBackground) ⇒ <code>string</code>
+    * [.setBackground(bg)](Map.md/#Panoramax.components.ui.Map+setBackground)
+    * [.getVisibleUsers()](Map.md/#Panoramax.components.ui.Map+getVisibleUsers) ⇒ <code>Array.&lt;string&gt;</code>
+    * [.setVisibleUsers(visibleIds)](Map.md/#Panoramax.components.ui.Map+setVisibleUsers)
+    * [.filterUserLayersContent(dataType, filter)](Map.md/#Panoramax.components.ui.Map+filterUserLayersContent)
+    * [.displayPictureMarker(lon, lat, heading, [skipCenter])](#Panoramax.components.ui.Map+displayPictureMarker)
+    * [.reloadLayersStyles()](Map.md/#Panoramax.components.ui.Map+reloadLayersStyles)
+    * [.addEventListener(type, listener)](Map.md/#Panoramax.components.ui.Map+addEventListener)
+    * ["filters-changed"](#Panoramax.components.ui.MapMore+event_filters-changed)
+    * ["ready"](Map.md/#Panoramax.components.ui.Map+event_ready)
+    * ["background-changed"](Map.md/#Panoramax.components.ui.Map+event_background-changed)
+    * ["users-changed"](Map.md/#Panoramax.components.ui.Map+event_users-changed)
+    * ["sequence-hover"](Map.md/#Panoramax.components.ui.Map+event_sequence-hover)
+    * ["sequence-click"](Map.md/#Panoramax.components.ui.Map+event_sequence-click)
+    * ["picture-click"](Map.md/#Panoramax.components.ui.Map+event_picture-click)
+
+<a name="new_Panoramax.components.ui.MapMore_new"></a>
+
+### new MapMore(parent, container, [options])
+MapMore is a more complete version of [Map UI component](Map.md/#Panoramax.components.ui.Map).
+
+It offers advanced features like themes, filters and more.
+
+Note that all functions of [MapLibre GL JS class Map](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/) are also available.
+
+⚠️ This class doesn't inherit from [EventTarget](https://developer.mozilla.org/fr/docs/Web/API/EventTarget), so it doesn't have `addEventListener` and `dispatchEvent` functions.
+It uses instead [`on`](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#on) and `fire` functions from MapLibre Map class.
+`fire` function doesn't take directly [`Event`](https://developer.mozilla.org/fr/docs/Web/API/Event) objects, but a string and object data.
+
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| parent | [<code>Basic</code>](../core/Basic.md/#Panoramax.components.core.Basic) |  | The parent view |
+| container | <code>Element</code> |  | The DOM element to create into |
+| [options] | <code>object</code> |  | The map options (any of [MapLibre GL settings](https://maplibre.org/maplibre-gl-js/docs/API/type-aliases/MapOptions/) or any supplementary option defined here) |
+| [options.raster] | <code>object</code> |  | The MapLibre raster source for aerial background. This must be a JSON object following [MapLibre raster source definition](https://maplibre.org/maplibre-style-spec/sources/#raster). |
+| [options.background] | <code>string</code> | <code>&quot;streets&quot;</code> | Choose default map background to display (streets or aerial, if raster aerial background available). Defaults to streets. |
+| [options.theme] | <code>string</code> | <code>&quot;default&quot;</code> | The map theme (default, age, score, type) |
+
+**Example**  
+```js
+const map = new Panoramax.components.ui.MapMore(viewer, mapNode, {center: {lat: 48.7, lng: -1.7}});
+```
+<a name="Panoramax.components.ui.Map+destroy"></a>
+
+### mapMore.destroy()
+Destroy any form of life in this component
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+<a name="Panoramax.components.ui.Map+waitForEnoughMapLoaded"></a>
+
+### mapMore.waitForEnoughMapLoaded() ⇒ <code>Promise</code>
+Helper to know when enough map background and Panoramax tiles are loaded for a proper display.
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Returns**: <code>Promise</code> - Resolves when enough is loaded  
+<a name="Panoramax.components.ui.Map+reloadVectorTiles"></a>
+
+### mapMore.reloadVectorTiles()
+Force refresh of vector tiles data
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+<a name="Panoramax.components.ui.Map+hasTwoBackgrounds"></a>
+
+### mapMore.hasTwoBackgrounds() ⇒ <code>boolean</code>
+Check if map offers aerial imagery as well as streets rendering.
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Returns**: <code>boolean</code> - True if aerial imagery is available for display  
+<a name="Panoramax.components.ui.Map+getBackground"></a>
+
+### mapMore.getBackground() ⇒ <code>string</code>
+Get the currently selected map background
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Returns**: <code>string</code> - aerial or streets  
+<a name="Panoramax.components.ui.Map+setBackground"></a>
+
+### mapMore.setBackground(bg)
+Change the shown background in map.
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Throws**:
+
+- <code>Error</code> If not aerial imagery is available
+
+
+| Param | Type | Description |
+| --- | --- | --- |
+| bg | <code>string</code> | The new background to display (aerial or streets) |
+
+<a name="Panoramax.components.ui.Map+getVisibleUsers"></a>
+
+### mapMore.getVisibleUsers() ⇒ <code>Array.&lt;string&gt;</code>
+Get the currently visible users
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Returns**: <code>Array.&lt;string&gt;</code> - List of visible users  
+<a name="Panoramax.components.ui.Map+setVisibleUsers"></a>
+
+### mapMore.setVisibleUsers(visibleIds)
+Make given user layers visible on map, and hide all others (if any)
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| visibleIds | <code>string</code> \| <code>Array.&lt;string&gt;</code> | The user layers IDs to display |
+
+<a name="Panoramax.components.ui.Map+filterUserLayersContent"></a>
+
+### mapMore.filterUserLayersContent(dataType, filter)
+Filter the visible data content in all visible map layers
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| dataType | <code>string</code> | sequences or pictures |
+| filter | <code>object</code> | The MapLibre GL filter rule to apply |
+
+<a name="Panoramax.components.ui.Map+displayPictureMarker"></a>
+
+### mapMore.displayPictureMarker(lon, lat, heading, [skipCenter])
+Shows on map a picture position and heading.
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| lon | <code>number</code> |  | The longitude |
+| lat | <code>number</code> |  | The latitude |
+| heading | <code>number</code> |  | The heading |
+| [skipCenter] | <code>boolean</code> | <code>false</code> | Set to true to avoid map centering on marker |
+
+<a name="Panoramax.components.ui.Map+reloadLayersStyles"></a>
+
+### mapMore.reloadLayersStyles()
+Forces reload of pictures/sequences layer styles.
+This is useful after a map theme change.
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+<a name="Panoramax.components.ui.Map+addEventListener"></a>
+
+### mapMore.addEventListener(type, listener)
+Listen to map events.
+This is a binder to [`on`](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#on) and [`once`](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#once) MapLibre GL functions.
+
+**Kind**: instance method of [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+
+| Param | Type | Default | Description |
+| --- | --- | --- | --- |
+| type | <code>string</code> |  | The event type to listen for |
+| listener | <code>function</code> |  | The event handler |
+| [options.once] | <code>boolean</code> | <code>false</code> | Set to true to only listen to first event. |
+
+<a name="Panoramax.components.ui.MapMore+event_filters-changed"></a>
+
+### "filters-changed"
+Event for filters changes
+
+**Kind**: event emitted by [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| [minDate] | <code>string</code> | The minimum date in time range (ISO format) |
+| [maxDate] | <code>string</code> | The maximum date in time range (ISO format) |
+| [pic_type] | <code>string</code> | Camera type (equirectangular, flat, null/empty string for both) |
+| [camera] | <code>string</code> | Camera make and model |
+| [theme] | <code>string</code> | Map theme |
+| [qualityscore] | <code>Array.&lt;number&gt;</code> | QualityScore values, as a list of 1 to 5 grades |
+
+<a name="Panoramax.components.ui.Map+event_ready"></a>
+
+### "ready"
+Event when map is ready to display.
+This includes Maplibre initial load, enough map data display and styling.
+
+**Kind**: event emitted by [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+<a name="Panoramax.components.ui.Map+event_background-changed"></a>
+
+### "background-changed"
+Event for map background changes
+
+**Kind**: event emitted by [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| [background] | <code>string</code> | The new selected background (aerial, streets) |
+
+<a name="Panoramax.components.ui.Map+event_users-changed"></a>
+
+### "users-changed"
+Event for visible users changes
+
+**Kind**: event emitted by [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| [usersIds] | <code>Array.&lt;string&gt;</code> | The list of newly selected users |
+
+<a name="Panoramax.components.ui.Map+event_sequence-hover"></a>
+
+### "sequence-hover"
+Event when a sequence on map is hovered (not selected)
+
+**Kind**: event emitted by [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| seqId | <code>string</code> | The hovered sequence ID |
+
+<a name="Panoramax.components.ui.Map+event_sequence-click"></a>
+
+### "sequence-click"
+Event when a sequence on map is clicked
+
+**Kind**: event emitted by [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| seqId | <code>string</code> | The clicked sequence ID |
+| coordinates | <code>maplibregl.LngLat</code> | The coordinates of user click |
+
+<a name="Panoramax.components.ui.Map+event_picture-click"></a>
+
+### "picture-click"
+Event when a picture on map is clicked
+
+**Kind**: event emitted by [<code>MapMore</code>](#Panoramax.components.ui.MapMore)  
+**Properties**
+
+| Name | Type | Description |
+| --- | --- | --- |
+| picId | <code>string</code> | The clicked picture ID |
+| seqId | <code>string</code> | The clicked picture's sequence ID |
+| feature | <code>object</code> | The GeoJSON feature of the picture |
+