@panoramax/web-viewer 3.2.3-develop-d7e5a16d → 3.2.3-develop-6257391e

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (221) hide show
  1. package/.gitlab-ci.yml +3 -0
  2. package/CHANGELOG.md +19 -0
  3. package/CODE_OF_CONDUCT.md +1 -1
  4. package/README.md +1 -1
  5. package/build/editor.html +10 -1
  6. package/build/index.css +2 -2
  7. package/build/index.css.map +1 -1
  8. package/build/index.html +1 -1
  9. package/build/index.js +1682 -5
  10. package/build/index.js.map +1 -1
  11. package/build/map.html +1 -1
  12. package/build/viewer.html +10 -1
  13. package/build/widgets.html +1 -0
  14. package/config/jest/mocks.js +172 -0
  15. package/config/paths.js +1 -0
  16. package/config/webpack.config.js +26 -0
  17. package/docs/03_URL_settings.md +3 -11
  18. package/docs/05_Compatibility.md +59 -76
  19. package/docs/09_Develop.md +30 -11
  20. package/docs/90_Releases.md +2 -2
  21. package/docs/images/class_diagram.drawio +28 -28
  22. package/docs/images/class_diagram.jpg +0 -0
  23. package/docs/index.md +112 -0
  24. package/docs/reference/components/core/Basic.md +153 -0
  25. package/docs/reference/components/core/CoverageMap.md +160 -0
  26. package/docs/reference/components/core/Editor.md +172 -0
  27. package/docs/reference/components/core/Viewer.md +288 -0
  28. package/docs/reference/components/layout/CorneredGrid.md +29 -0
  29. package/docs/reference/components/layout/Mini.md +45 -0
  30. package/docs/reference/components/menus/MapBackground.md +32 -0
  31. package/docs/reference/components/menus/MapFilters.md +15 -0
  32. package/docs/reference/components/menus/MapLayers.md +15 -0
  33. package/docs/reference/components/menus/MapLegend.md +15 -0
  34. package/docs/reference/components/menus/PictureLegend.md +15 -0
  35. package/docs/reference/components/menus/PictureMetadata.md +15 -0
  36. package/docs/reference/components/menus/PlayerOptions.md +15 -0
  37. package/docs/reference/components/menus/QualityScoreDoc.md +15 -0
  38. package/docs/reference/components/menus/ReportForm.md +15 -0
  39. package/docs/reference/components/menus/ShareMenu.md +15 -0
  40. package/docs/reference/components/ui/Button.md +39 -0
  41. package/docs/reference/components/ui/ButtonGroup.md +36 -0
  42. package/docs/reference/components/ui/CopyButton.md +35 -0
  43. package/docs/reference/components/ui/Grade.md +32 -0
  44. package/docs/reference/components/ui/LinkButton.md +44 -0
  45. package/docs/reference/components/ui/Loader.md +54 -0
  46. package/docs/reference/components/ui/Map.md +214 -0
  47. package/docs/reference/components/ui/MapMore.md +233 -0
  48. package/docs/reference/components/ui/Photo.md +369 -0
  49. package/docs/reference/components/ui/Popup.md +56 -0
  50. package/docs/reference/components/ui/QualityScore.md +45 -0
  51. package/docs/reference/components/ui/SearchBar.md +63 -0
  52. package/docs/reference/components/ui/TogglableGroup.md +39 -0
  53. package/docs/reference/components/ui/widgets/GeoSearch.md +32 -0
  54. package/docs/reference/components/ui/widgets/Legend.md +32 -0
  55. package/docs/reference/components/ui/widgets/MapFiltersButton.md +33 -0
  56. package/docs/reference/components/ui/widgets/MapLayersButton.md +15 -0
  57. package/docs/reference/components/ui/widgets/Player.md +32 -0
  58. package/docs/reference/components/ui/widgets/Share.md +15 -0
  59. package/docs/reference/components/ui/widgets/Zoom.md +15 -0
  60. package/docs/reference/utils/API.md +311 -0
  61. package/docs/reference/utils/InitParameters.md +67 -0
  62. package/docs/reference/utils/URLHandler.md +102 -0
  63. package/docs/reference.md +73 -0
  64. package/docs/shortcuts.md +11 -0
  65. package/docs/tutorials/aerial_imagery.md +19 -0
  66. package/docs/tutorials/authentication.md +10 -0
  67. package/docs/tutorials/custom_widgets.md +64 -0
  68. package/docs/tutorials/map_style.md +27 -0
  69. package/docs/tutorials/migrate_v4.md +122 -0
  70. package/docs/tutorials/synced_coverage.md +42 -0
  71. package/mkdocs.yml +60 -5
  72. package/package.json +10 -7
  73. package/public/editor.html +21 -29
  74. package/public/index.html +3 -3
  75. package/public/map.html +19 -18
  76. package/public/viewer.html +18 -24
  77. package/public/widgets.html +265 -0
  78. package/scripts/doc.js +77 -0
  79. package/src/components/core/Basic.css +44 -0
  80. package/src/components/core/Basic.js +258 -0
  81. package/src/components/core/CoverageMap.css +9 -0
  82. package/src/components/core/CoverageMap.js +105 -0
  83. package/src/components/core/Editor.css +23 -0
  84. package/src/components/core/Editor.js +354 -0
  85. package/src/components/core/Viewer.css +109 -0
  86. package/src/components/core/Viewer.js +707 -0
  87. package/src/components/core/index.js +11 -0
  88. package/src/components/index.js +13 -0
  89. package/src/components/layout/CorneredGrid.js +109 -0
  90. package/src/components/layout/Mini.js +117 -0
  91. package/src/components/layout/index.js +7 -0
  92. package/src/components/menus/MapBackground.js +106 -0
  93. package/src/components/menus/MapFilters.js +386 -0
  94. package/src/components/menus/MapLayers.js +143 -0
  95. package/src/components/menus/MapLegend.js +54 -0
  96. package/src/components/menus/PictureLegend.js +103 -0
  97. package/src/components/menus/PictureMetadata.js +188 -0
  98. package/src/components/menus/PlayerOptions.js +96 -0
  99. package/src/components/menus/QualityScoreDoc.js +36 -0
  100. package/src/components/menus/ReportForm.js +133 -0
  101. package/src/components/menus/Share.js +228 -0
  102. package/src/components/menus/index.js +15 -0
  103. package/src/components/styles.js +365 -0
  104. package/src/components/ui/Button.js +75 -0
  105. package/src/components/ui/ButtonGroup.css +49 -0
  106. package/src/components/ui/ButtonGroup.js +68 -0
  107. package/src/components/ui/CopyButton.js +71 -0
  108. package/src/components/ui/Grade.js +54 -0
  109. package/src/components/ui/LinkButton.js +68 -0
  110. package/src/components/ui/Loader.js +188 -0
  111. package/src/components/{Map.css → ui/Map.css} +5 -17
  112. package/src/components/{Map.js → ui/Map.js} +114 -138
  113. package/src/components/ui/MapMore.js +324 -0
  114. package/src/components/{Photo.css → ui/Photo.css} +6 -6
  115. package/src/components/{Photo.js → ui/Photo.js} +279 -90
  116. package/src/components/ui/Popup.js +145 -0
  117. package/src/components/ui/QualityScore.js +152 -0
  118. package/src/components/ui/SearchBar.js +363 -0
  119. package/src/components/ui/TogglableGroup.js +162 -0
  120. package/src/components/ui/index.js +20 -0
  121. package/src/components/ui/widgets/GeoSearch.css +21 -0
  122. package/src/components/ui/widgets/GeoSearch.js +139 -0
  123. package/src/components/ui/widgets/Legend.js +51 -0
  124. package/src/components/ui/widgets/MapFiltersButton.js +104 -0
  125. package/src/components/ui/widgets/MapLayersButton.js +79 -0
  126. package/src/components/ui/widgets/Player.css +7 -0
  127. package/src/components/ui/widgets/Player.js +148 -0
  128. package/src/components/ui/widgets/Share.js +30 -0
  129. package/src/components/ui/widgets/Zoom.js +82 -0
  130. package/src/components/ui/widgets/index.js +12 -0
  131. package/src/img/panoramax.svg +13 -0
  132. package/src/img/switch_big.svg +20 -10
  133. package/src/index.js +6 -9
  134. package/src/translations/da.json +1 -1
  135. package/src/translations/de.json +1 -1
  136. package/src/translations/en.json +5 -3
  137. package/src/translations/eo.json +1 -1
  138. package/src/translations/es.json +1 -1
  139. package/src/translations/fr.json +5 -3
  140. package/src/translations/hu.json +1 -1
  141. package/src/translations/it.json +1 -1
  142. package/src/translations/ja.json +1 -1
  143. package/src/translations/nl.json +1 -1
  144. package/src/translations/pl.json +1 -1
  145. package/src/translations/sv.json +1 -1
  146. package/src/translations/zh_Hant.json +1 -1
  147. package/src/utils/API.js +74 -42
  148. package/src/utils/InitParameters.js +354 -0
  149. package/src/utils/URLHandler.js +364 -0
  150. package/src/utils/geocoder.js +116 -0
  151. package/src/utils/{I18n.js → i18n.js} +3 -1
  152. package/src/utils/index.js +11 -0
  153. package/src/utils/{Map.js → map.js} +216 -80
  154. package/src/utils/picture.js +433 -0
  155. package/src/utils/utils.js +315 -0
  156. package/src/utils/widgets.js +93 -0
  157. package/tests/components/ui/CopyButton.test.js +52 -0
  158. package/tests/components/ui/Loader.test.js +54 -0
  159. package/tests/components/{Map.test.js → ui/Map.test.js} +19 -61
  160. package/tests/components/{Photo.test.js → ui/Photo.test.js} +89 -57
  161. package/tests/components/ui/Popup.test.js +24 -0
  162. package/tests/components/ui/QualityScore.test.js +17 -0
  163. package/tests/components/ui/SearchBar.test.js +107 -0
  164. package/tests/components/ui/__snapshots__/CopyButton.test.js.snap +34 -0
  165. package/tests/components/ui/__snapshots__/Loader.test.js.snap +56 -0
  166. package/tests/components/{__snapshots__ → ui/__snapshots__}/Map.test.js.snap +11 -38
  167. package/tests/components/{__snapshots__ → ui/__snapshots__}/Photo.test.js.snap +57 -4
  168. package/tests/components/ui/__snapshots__/Popup.test.js.snap +29 -0
  169. package/tests/components/ui/__snapshots__/QualityScore.test.js.snap +11 -0
  170. package/tests/components/ui/__snapshots__/SearchBar.test.js.snap +65 -0
  171. package/tests/utils/API.test.js +1 -14
  172. package/tests/utils/InitParameters.test.js +485 -0
  173. package/tests/utils/URLHandler.test.js +350 -0
  174. package/tests/utils/__snapshots__/URLHandler.test.js.snap +21 -0
  175. package/tests/utils/__snapshots__/picture.test.js.snap +315 -0
  176. package/tests/utils/__snapshots__/widgets.test.js.snap +19 -0
  177. package/tests/utils/geocoder.test.js +37 -0
  178. package/tests/utils/{I18n.test.js → i18n.test.js} +1 -1
  179. package/tests/utils/map.test.js +67 -0
  180. package/tests/utils/picture.test.js +745 -0
  181. package/tests/utils/utils.test.js +288 -0
  182. package/tests/utils/widgets.test.js +90 -0
  183. package/docs/01_Start.md +0 -149
  184. package/docs/02_Usage.md +0 -831
  185. package/docs/04_Advanced_examples.md +0 -216
  186. package/src/Editor.css +0 -37
  187. package/src/Editor.js +0 -361
  188. package/src/StandaloneMap.js +0 -114
  189. package/src/Viewer.css +0 -203
  190. package/src/Viewer.js +0 -1246
  191. package/src/components/CoreView.css +0 -70
  192. package/src/components/CoreView.js +0 -175
  193. package/src/components/Loader.css +0 -74
  194. package/src/components/Loader.js +0 -120
  195. package/src/utils/Exif.js +0 -193
  196. package/src/utils/Utils.js +0 -631
  197. package/src/utils/Widgets.js +0 -562
  198. package/src/viewer/URLHash.js +0 -469
  199. package/src/viewer/Widgets.css +0 -880
  200. package/src/viewer/Widgets.js +0 -1470
  201. package/tests/Editor.test.js +0 -126
  202. package/tests/StandaloneMap.test.js +0 -45
  203. package/tests/Viewer.test.js +0 -366
  204. package/tests/__snapshots__/Editor.test.js.snap +0 -298
  205. package/tests/__snapshots__/StandaloneMap.test.js.snap +0 -30
  206. package/tests/__snapshots__/Viewer.test.js.snap +0 -195
  207. package/tests/components/CoreView.test.js +0 -92
  208. package/tests/components/Loader.test.js +0 -38
  209. package/tests/components/__snapshots__/Loader.test.js.snap +0 -15
  210. package/tests/utils/Exif.test.js +0 -124
  211. package/tests/utils/Map.test.js +0 -113
  212. package/tests/utils/Utils.test.js +0 -300
  213. package/tests/utils/Widgets.test.js +0 -107
  214. package/tests/utils/__snapshots__/Exif.test.js.snap +0 -43
  215. package/tests/utils/__snapshots__/Utils.test.js.snap +0 -41
  216. package/tests/utils/__snapshots__/Widgets.test.js.snap +0 -44
  217. package/tests/viewer/URLHash.test.js +0 -559
  218. package/tests/viewer/Widgets.test.js +0 -127
  219. package/tests/viewer/__snapshots__/URLHash.test.js.snap +0 -108
  220. package/tests/viewer/__snapshots__/Widgets.test.js.snap +0 -403
  221. /package/tests/utils/__snapshots__/{Map.test.js.snap → geocoder.test.js.snap} +0 -0
package/docs/02_Usage.md DELETED
@@ -1,831 +0,0 @@
1
- <!-- Generated by documentation.js. Update this documentation by updating the source code. -->
2
-
3
- ### Table of Contents
4
-
5
- * [CoreView][1]
6
- * [Map][2]
7
- * [Photo][3]
8
- * [Editor][4]
9
- * [StandaloneMap][5]
10
- * [Viewer][6]
11
-
12
- ## CoreView
13
-
14
- **Extends EventTarget**
15
-
16
- Core view is an abstract class used for setting up any of the main Panoramax JS view components.
17
-
18
- It is used to prepare API, internationalization, options checks... for Viewer, StandaloneMap and Editor classes.
19
-
20
- ### Parameters
21
-
22
- * `container` **([string][7] | [Element][8])** The DOM element to create viewer into
23
- * `endpoint` **[string][7]** URL to API to use (must be a [STAC API][9])
24
- * `options` **[object][10]?** View options. (optional, default `{}`)
25
-
26
- * `options.selectedSequence` **[string][7]?** The ID of sequence to highlight on load (defaults to none)
27
- * `options.selectedPicture` **[string][7]?** The ID of picture to highlight on load (defaults to none)
28
- * `options.fetchOptions` **[object][10]** Set custom options for fetch calls made against API ([same syntax as fetch options parameter][11]) (optional, default `null`)
29
- * `options.users` **([string][7] | [Array][12]<[string][7]>)?** List of user IDs to default use for display. Defaults to all users.
30
- * `options.style` **([string][7] | [object][10])?** The map's MapLibre style. This can be an a JSON object conforming to the schema described in the [MapLibre Style Specification][13], or a URL string pointing to one. Defaults to OSMFR vector tiles.
31
-
32
- ### Properties
33
-
34
- * `_t` **[object][10]** The translations labels
35
- * `_selectedSeqId` **[string][7]** The selected sequence ID
36
- * `_selectedPicId` **[string][7]** The selected picture ID
37
- * `_api` **API** The API handler
38
- * `_loader` **Loader** The initial loader message
39
- * `_options` **[object][10]** The stored options
40
- * `container` **[Element][8]** The DOM container
41
-
42
- ### getClassName
43
-
44
- This allows to retrieve an always correct class name.
45
- This is crap, but avoids issues with Webpack & so on.
46
-
47
- Each inheriting class must override this method.
48
-
49
- ### destroy
50
-
51
- Ends all form of life in this object.
52
-
53
- This is useful for Single Page Applications (SPA), to remove various event listeners.
54
-
55
- ### isWidthSmall
56
-
57
- Is the view running in a small container (small embed or smartphone)
58
-
59
- Returns **[boolean][14]** True if container is small
60
-
61
- ### isHeightSmall
62
-
63
- Is the view running in a small-height container (small embed or smartphone)
64
-
65
- Returns **[boolean][14]** True if container height is small
66
-
67
- ### select
68
-
69
- Change the currently picture and/or sequence.
70
- Calling the method without parameters unselects.
71
-
72
- #### Parameters
73
-
74
- * `seqId` **[string][7]?** The sequence UUID (optional, default `null`)
75
- * `picId` **[string][7]?** The picture UUID (optional, default `null`)
76
- * `force` **[boolean][14]** Force select even if already selected (optional, default `false`)
77
-
78
- ### select
79
-
80
- Event for sequence/picture selection
81
-
82
- Type: [object][10]
83
-
84
- #### Properties
85
-
86
- * `detail` **[object][10]** Event information
87
-
88
- * `detail.seqId` **[string][7]** The selected sequence ID
89
- * `detail.picId` **[string][7]** The selected picture ID (or null if not a precise picture clicked)
90
- * `detail.prevSeqId` **[string][7]?** The previously selected sequence ID (or null if none)
91
- * `detail.prevPicId` **[string][7]?** The previously selected picture ID (or null if none)
92
-
93
- ### ready
94
-
95
- Event for viewer being ready to use (API loaded)
96
-
97
- ### broken
98
-
99
- Event for viewer failing to initially load
100
-
101
- Type: [object][10]
102
-
103
- #### Properties
104
-
105
- * `detail` **[object][10]** Event information
106
-
107
- * `detail.error` **[string][7]** The user-friendly error message to display
108
-
109
- ### map:background-changed
110
-
111
- Event for map background changes
112
-
113
- Type: [object][10]
114
-
115
- #### Properties
116
-
117
- * `detail` **[object][10]** Event information
118
-
119
- * `detail.background` **[string][7]?** The new selected background (aerial, streets)
120
-
121
- ### map:users-changed
122
-
123
- Event for visible users changes
124
-
125
- Type: [object][10]
126
-
127
- #### Properties
128
-
129
- * `detail` **[object][10]** Event information
130
-
131
- * `detail.usersIds` **[Array][12]<[string][7]>?** The list of newly selected users
132
-
133
- ### map:sequence-hover
134
-
135
- Event when a sequence on map is hovered (not selected)
136
-
137
- Type: [object][10]
138
-
139
- #### Properties
140
-
141
- * `detail` **[object][10]** Event information
142
-
143
- * `detail.seqId` **[string][7]** The hovered sequence ID
144
-
145
- ### map:sequence-click
146
-
147
- Event when a sequence on map is clicked
148
-
149
- Type: [object][10]
150
-
151
- #### Properties
152
-
153
- * `detail` **[object][10]** Event information
154
-
155
- * `detail.seqId` **[string][7]** The clicked sequence ID
156
- * `detail.coordinates` **maplibregl.LngLat** The coordinates of user click
157
-
158
- ### map:picture-click
159
-
160
- Event when a picture on map is clicked
161
-
162
- Type: [object][10]
163
-
164
- #### Properties
165
-
166
- * `detail` **[object][10]** Event information
167
-
168
- * `detail.picId` **[string][7]** The clicked picture ID
169
- * `detail.seqId` **[string][7]** The clicked picture's sequence ID
170
- * `detail.feature` **[object][10]** The GeoJSON feature of the picture
171
-
172
- ### psv:picture-loading
173
-
174
- Event for picture starting to load
175
-
176
- Type: [object][10]
177
-
178
- #### Properties
179
-
180
- * `detail` **[object][10]** Event information
181
-
182
- * `detail.picId` **[string][7]** The picture unique identifier
183
- * `detail.lon` **[number][15]** Longitude (WGS84)
184
- * `detail.lat` **[number][15]** Latitude (WGS84)
185
- * `detail.x` **[number][15]** New x position (in degrees, 0-360), corresponds to heading (0° = North, 90° = East, 180° = South, 270° = West)
186
- * `detail.y` **[number][15]** New y position (in degrees)
187
- * `detail.z` **[number][15]** New z position (0-100)
188
-
189
- ### psv:picture-preview-started
190
-
191
- Event for picture preview
192
-
193
- Type: [object][10]
194
-
195
- #### Properties
196
-
197
- * `detail` **[object][10]** Event information
198
-
199
- * `detail.picId` **[string][7]** The picture ID
200
- * `detail.coordinates` **[Array][12]<[number][15]>** \[x,y] coordinates
201
- * `detail.direction` **[number][15]** The theorical picture orientation
202
-
203
- ### psv:picture-preview-stopped
204
-
205
- Event for end of picture preview
206
-
207
- Type: [object][10]
208
-
209
- #### Properties
210
-
211
- * `detail` **[object][10]** Event information
212
-
213
- * `detail.picId` **[string][7]** The picture ID
214
-
215
- ### psv:view-rotated
216
-
217
- Event for viewer rotation
218
-
219
- Type: [object][10]
220
-
221
- #### Properties
222
-
223
- * `detail` **[object][10]** Event information
224
-
225
- * `detail.x` **[number][15]** New x position (in degrees, 0-360), corresponds to heading (0° = North, 90° = East, 180° = South, 270° = West)
226
- * `detail.y` **[number][15]** New y position (in degrees)
227
- * `detail.z` **[number][15]** New Z position (between 0 and 100)
228
-
229
- ### psv:picture-loaded
230
-
231
- Event for picture load (low-resolution image is loaded)
232
-
233
- Type: [object][10]
234
-
235
- #### Properties
236
-
237
- * `detail` **[object][10]** Event information
238
-
239
- * `detail.picId` **[string][7]** The picture unique identifier
240
- * `detail.lon` **[number][15]** Longitude (WGS84)
241
- * `detail.lat` **[number][15]** Latitude (WGS84)
242
- * `detail.x` **[number][15]** New x position (in degrees, 0-360), corresponds to heading (0° = North, 90° = East, 180° = South, 270° = West)
243
- * `detail.y` **[number][15]** New y position (in degrees)
244
- * `detail.z` **[number][15]** New z position (0-100)
245
-
246
- ### psv:picture-tiles-loaded
247
-
248
- Event launched when all visible tiles of a picture are loaded
249
-
250
- Type: [object][10]
251
-
252
- #### Properties
253
-
254
- * `detail` **[object][10]** Event information
255
-
256
- * `detail.picId` **[string][7]** The picture unique identifier
257
-
258
- ### psv:transition-duration-changed
259
-
260
- Event for transition duration change
261
-
262
- Type: [object][10]
263
-
264
- #### Properties
265
-
266
- * `detail` **[object][10]** Event information
267
-
268
- * `detail.duration` **[string][7]** New duration (in milliseconds)
269
-
270
- ## Map
271
-
272
- **Extends maplibregl.Map**
273
-
274
- Map is the component showing pictures and sequences geolocation.
275
-
276
- Note that all functions of [MapLibre GL JS class Map][16] are also available.
277
-
278
- ### Parameters
279
-
280
- * `parent` **[CoreView][1]** The parent view
281
- * `container` **[Element][8]** The DOM element to create into
282
- * `options` **[object][10]?** The map options (any of [MapLibre GL settings][17] or any supplementary option defined here) (optional, default `{}`)
283
-
284
- * `options.raster` **[object][10]?** The MapLibre raster source for aerial background. This must be a JSON object following [MapLibre raster source definition][18].
285
- * `options.background` **[string][7]?** Choose default map background to display (streets or aerial, if raster aerial background available). Defaults to street.
286
- * `options.geocoder` **[object][10]?** Optional geocoder settings
287
-
288
- * `options.geocoder.engine` **[string][7]?** Set the geocoder engine to use (nominatim, ban)
289
-
290
- ### destroy
291
-
292
- Destroy any form of life in this component
293
-
294
- ### waitForEnoughMapLoaded
295
-
296
- Helper to know when enough map background and Panoramax tiles are loaded for a proper display.
297
-
298
- Returns **[Promise][19]** Resolves when enough is loaded
299
-
300
- ### reloadVectorTiles
301
-
302
- Force refresh of vector tiles data
303
-
304
- ### hasTwoBackgrounds
305
-
306
- Check if map offers aerial imagery as well as streets rendering.
307
-
308
- Returns **[boolean][14]** True if aerial imagery is available for display
309
-
310
- ### getBackground
311
-
312
- Get the currently selected map background
313
-
314
- Returns **[string][7]** aerial or streets
315
-
316
- ### setBackground
317
-
318
- Change the shown background in map.
319
-
320
- #### Parameters
321
-
322
- * `bg` **[string][7]** The new background to display (aerial or streets)
323
-
324
- ### getVisibleUsers
325
-
326
- Get the currently visible users
327
-
328
- Returns **[Array][12]<[string][7]>** List of visible users
329
-
330
- ### setVisibleUsers
331
-
332
- Make given user layers visible on map, and hide all others (if any)
333
-
334
- #### Parameters
335
-
336
- * `visibleIds` **([string][7] | [Array][12]<[string][7]>)** The user layers IDs to display (optional, default `[]`)
337
-
338
- ### filterUserLayersContent
339
-
340
- Filter the visible data content in all visible map layers
341
-
342
- #### Parameters
343
-
344
- * `dataType` **[string][7]** sequences or pictures
345
- * `filter` **[object][10]** The MapLibre GL filter rule to apply
346
-
347
- ### displayPictureMarker
348
-
349
- Shows on map a picture position and heading.
350
-
351
- #### Parameters
352
-
353
- * `lon` **[number][15]** The longitude
354
- * `lat` **[number][15]** The latitude
355
- * `heading` **[number][15]** The heading
356
-
357
- ### reloadLayersStyles
358
-
359
- Forces reload of pictures/sequences layer styles.
360
- This is useful after a map theme change.
361
-
362
- ## Photo
363
-
364
- **Extends PSViewer**
365
-
366
- Photo is the component showing a single picture.
367
- It uses Photo Sphere Viewer as a basis, and pre-configure dialog with STAC API.
368
-
369
- Note that all functions of [PhotoSphereViewer Viewer class][20] are available as well.
370
-
371
- ### Parameters
372
-
373
- * `parent` **[CoreView][1]** The parent view
374
- * `container` **[Element][8]** The DOM element to create into
375
- * `options` **[object][10]?** The viewer options. Can be any of [Photo Sphere Viewer options][21] (optional, default `{}`)
376
-
377
- * `options.transitionDuration` **[number][15]?** The number of milliseconds the transition animation should be.
378
- * `options.shouldGoFast` **[function][22]?** Function returning a boolean to indicate if we may skip loading HD images.
379
-
380
- ### getPictureMetadata
381
-
382
- Access currently shown picture metadata
383
-
384
- Returns **[object][10]** Picture metadata
385
-
386
- ### goToNextPicture
387
-
388
- Displays next picture in current sequence (if any)
389
-
390
- ### goToPrevPicture
391
-
392
- Displays previous picture in current sequence (if any)
393
-
394
- ### goToPosition
395
-
396
- Displays in viewer a picture near to given coordinates
397
-
398
- #### Parameters
399
-
400
- * `lat` **[number][15]** Latitude (WGS84)
401
- * `lon` **[number][15]** Longitude (WGS84)
402
-
403
- Returns **[Promise][19]** Resolves on picture ID if picture found, otherwise rejects
404
-
405
- ### getXY
406
-
407
- Get 2D position of sphere currently shown to user
408
-
409
- Returns **[object][10]** Position in format { x: heading in degrees (0° = North, 90° = East, 180° = South, 270° = West), y: top/bottom position in degrees (-90° = bottom, 0° = front, 90° = top) }
410
-
411
- ### getXYZ
412
-
413
- Get 3D position of sphere currently shown to user
414
-
415
- Returns **[object][10]** Position in format { x: heading in degrees (0° = North, 90° = East, 180° = South, 270° = West), y: top/bottom position in degrees (-90° = bottom, 0° = front, 90° = top), z: zoom (0 = wide, 100 = zoomed in) }
416
-
417
- ### getPictureOriginalHeading
418
-
419
- Get capture orientation of current picture, based on its GPS.
420
-
421
- Returns **any** Picture original heading in degrees (0 to 360°)
422
-
423
- ### getPictureRelativeHeading
424
-
425
- Computes the relative heading of currently selected picture.
426
- This gives the angle of capture compared to sequence path (vehicle movement).
427
-
428
- Returns **any** Relative heading in degrees (-180 to 180)
429
-
430
- ### clearPictureMetadataCache
431
-
432
- Clears the Photo Sphere Viewer metadata cache.
433
- It is useful when current picture or sequence has changed server-side after first load.
434
-
435
- ### setXYZ
436
-
437
- Change the shown position in picture
438
-
439
- #### Parameters
440
-
441
- * `x` **[number][15]** X position (in degrees)
442
- * `y` **[number][15]** Y position (in degrees)
443
- * `z` **[number][15]** Z position (0-100)
444
-
445
- ### setHigherContrast
446
-
447
- Enable or disable higher contrast on picture
448
-
449
- #### Parameters
450
-
451
- * `enable` **[boolean][14]** True to enable higher contrast
452
-
453
- ### getTransitionDuration
454
-
455
- Get the duration of stay on a picture during a sequence play.
456
-
457
- Returns **[number][15]** The duration (in milliseconds)
458
-
459
- ### setTransitionDuration
460
-
461
- Changes the duration of stay on a picture during a sequence play.
462
-
463
- #### Parameters
464
-
465
- * `value` **[number][15]** The new duration (in milliseconds, between 100 and 3000)
466
-
467
- ### showErrorOverlay
468
-
469
- Display an error message to user on screen
470
-
471
- #### Parameters
472
-
473
- * `e` **[object][10]** The initial error
474
- * `label` **str** The main error label to display
475
- * `dissmisable` **[boolean][14]** Is error dissmisable
476
-
477
- ## Editor
478
-
479
- **Extends CoreView**
480
-
481
- Editor allows to focus on a single sequence, and preview what you edits would look like.
482
- It shows both picture and map.
483
-
484
- Note that you can use any of the [CoreView][23] class functions as well.
485
-
486
- ### Parameters
487
-
488
- * `container` **([string][7] | [Element][8])** The DOM element to create viewer into
489
- * `endpoint` **[string][7]** URL to API to use (must be a [STAC API][9])
490
- * `options` **[object][10]?** View options. (optional, default `{}`)
491
-
492
- * `options.selectedSequence` **[string][7]** The ID of sequence to highlight on load. Must be always defined.
493
- * `options.selectedPicture` **[string][7]?** The ID of picture to highlight on load (defaults to none)
494
- * `options.fetchOptions` **[object][10]** Set custom options for fetch calls made against API ([same syntax as fetch options parameter][11]) (optional, default `null`)
495
- * `options.raster` **[object][10]?** The MapLibre raster source for aerial background. This must be a JSON object following [MapLibre raster source definition][18].
496
- * `options.background` **[string][7]?** Choose default map background to display (streets or aerial, if raster aerial background available). Defaults to street.
497
- * `options.style` **([string][7] | [object][10])?** The map's MapLibre style. This can be an a JSON object conforming to the schema described in the [MapLibre Style Specification][13], or a URL string pointing to one.
498
-
499
- ### Properties
500
-
501
- * `map` **[Map][2]** The map widget
502
- * `psv` **[Photo][3]** The photo widget
503
-
504
- ### previewSequenceHeadingChange
505
-
506
- Preview on map how the new relative heading would reflect on all pictures.
507
- This doesn't change anything on API-side, it's just a preview.
508
-
509
- #### Parameters
510
-
511
- * `relHeading` **[number][15]?** The new relative heading compared to sequence path. In degrees, between -180 and 180 (0 = front, -90 = left, 90 = right). Set to null to remove preview.
512
-
513
- ## StandaloneMap
514
-
515
- **Extends CoreView**
516
-
517
- The standalone map viewer allows to see STAC pictures data as a map.
518
- It only embeds a map (no 360° pictures viewer) with a minimal picture preview (thumbnail).
519
-
520
- Note that you can use any of the [CoreView][23] class functions as well.
521
-
522
- ### Parameters
523
-
524
- * `container` **([string][7] | [Element][8])** The DOM element to create viewer into
525
- * `endpoint` **[string][7]** URL to API to use (must be a [STAC API][9])
526
- * `options` **[object][10]?** Map options. Various settings can be passed, either the ones defined here, or any of [MapLibre GL settings][17]. (optional, default `{}`)
527
-
528
- * `options.selectedSequence` **[string][7]?** The ID of sequence to highlight on load (defaults to none)
529
- * `options.selectedPicture` **[string][7]?** The ID of picture to highlight on load (defaults to none)
530
- * `options.fetchOptions` **[object][10]** Set custom options for fetch calls made against API ([same syntax as fetch options parameter][11]) (optional, default `null`)
531
- * `options.minZoom` **[number][15]** The minimum zoom level of the map (0-24). (optional, default `0`)
532
- * `options.maxZoom` **[number][15]** The maximum zoom level of the map (0-24). (optional, default `24`)
533
- * `options.style` **([string][7] | [object][10])?** The map's MapLibre style. This can be an a JSON object conforming to the schema described in the [MapLibre Style Specification][13], or a URL string pointing to one.
534
- * `options.center` **external:maplibre-gl.LngLatLike** The initial geographical centerpoint of the map. If `center` is not specified in the constructor options, MapLibre GL JS will look for it in the map's style object. If it is not specified in the style, either, it will default to `[0, 0]` Note: MapLibre GL uses longitude, latitude coordinate order (as opposed to latitude, longitude) to match GeoJSON. (optional, default `[0,0]`)
535
- * `options.zoom` **[number][15]** The initial zoom level of the map. If `zoom` is not specified in the constructor options, MapLibre GL JS will look for it in the map's style object. If it is not specified in the style, either, it will default to `0`. (optional, default `0`)
536
- * `options.bounds` **external:maplibre-gl.LngLatBoundsLike?** The initial bounds of the map. If `bounds` is specified, it overrides `center` and `zoom` constructor options.
537
- * `options.users` **[Array][12]<[string][7]>?** The IDs of users whom data should appear on map (defaults to all)
538
-
539
- ### Properties
540
-
541
- * `map` **[Map][2]** The map widget
542
-
543
- ### destroy
544
-
545
- Ends all form of life in this object.
546
-
547
- This is useful for Single Page Applications (SPA), to remove various event listeners.
548
-
549
- ## Viewer
550
-
551
- **Extends CoreView**
552
-
553
- Viewer is the main component of Panoramax JS library, showing pictures and map.
554
-
555
- Note that you can use any of the [CoreView][23] class functions as well.
556
-
557
- ### Parameters
558
-
559
- * `container` **([string][7] | [Element][8])** The DOM element to create viewer into
560
- * `endpoint` **[string][7]** URL to API to use (must be a [STAC API][9])
561
- * `options` **[object][10]?** Viewer options (optional, default `{}`)
562
-
563
- * `options.selectedPicture` **[string][7]?** Initial picture identifier to display
564
- * `options.position` **[Array][12]<[number][15]>?** Initial position to go to (in \[lat, lon] format)
565
- * `options.hash` **[boolean][14]** Enable URL hash settings (optional, default `true`)
566
- * `options.lang` **[string][7]?** Override language to use (defaults to navigator language, or English if translation not available)
567
- * `options.transition` **int** Duration of stay on a picture during sequence play (excludes loading time) (optional, default `250`)
568
- * `options.fetchOptions` **[object][10]** Set custom options for fetch calls made against API ([same syntax as fetch options parameter][11]) (optional, default `null`)
569
- * `options.users` **([string][7] | [Array][12]<[string][7]>)?** The IDs of users whom data should appear on map (defaults to all). Only works with API having a "user-xyz" or "user-xyz-style" endpoint.
570
- * `options.picturesNavigation` **[string][7]?** The allowed navigation between pictures ("any": no restriction (default), "seq": only pictures in same sequence, "pic": only selected picture)
571
- * `options.map` **([boolean][14] | [object][10])** Enable contextual map for locating pictures. Setting to true or passing an object enables the map. Various settings can be passed, either the ones defined here, or any of [MapLibre GL settings][17] (optional, default `false`)
572
-
573
- * `options.map.startWide` **[boolean][14]?** Show the map as main element at startup (defaults to false, viewer is wider at start)
574
- * `options.map.minZoom` **[number][15]** The minimum zoom level of the map (0-24). (optional, default `0`)
575
- * `options.map.maxZoom` **[number][15]** The maximum zoom level of the map (0-24). (optional, default `24`)
576
- * `options.map.raster` **[object][10]?** The MapLibre raster source for aerial background. This must be a JSON object following [MapLibre raster source definition][18].
577
- * `options.map.center` **external:maplibre-gl.LngLatLike** The initial geographical centerpoint of the map. If `center` is not specified in the constructor options, MapLibre GL JS will look for it in the map's style object. If it is not specified in the style, either, it will default to `[0, 0]` Note: MapLibre GL uses longitude, latitude coordinate order (as opposed to latitude, longitude) to match GeoJSON. (optional, default `[0,0]`)
578
- * `options.map.zoom` **[number][15]** The initial zoom level of the map. If `zoom` is not specified in the constructor options, MapLibre GL JS will look for it in the map's style object. If it is not specified in the style, either, it will default to `0`. (optional, default `0`)
579
- * `options.map.bounds` **external:maplibre-gl.LngLatBoundsLike?** The initial bounds of the map. If `bounds` is specified, it overrides `center` and `zoom` constructor options.
580
- * `options.map.geocoder` **[object][10]?** Optional geocoder settings
581
-
582
- * `options.map.geocoder.engine` **[string][7]?** Set the geocoder engine to use (nominatim, ban)
583
- * `options.map.background` **[string][7]?** Choose default map background to display (streets or aerial, if raster aerial background available). Defaults to street.
584
- * `options.map.theme` **[string][7]** The colouring scheme to use for pictures and sequences on map (default, age, type) (optional, default `default`)
585
- * `options.style` **([string][7] | [object][10])?** The map's MapLibre style. This can be an a JSON object conforming to the schema described in the [MapLibre Style Specification][13], or a URL string pointing to one.
586
- * `options.widgets` **[object][10]?** Settings related to viewer buttons and widgets
587
-
588
- * `options.widgets.editIdUrl` **[string][7]?** URL to the OpenStreetMap iD editor (defaults to OSM.org iD instance)
589
- * `options.widgets.customWidget` **([string][7] | [Element][8])?** A user-defined widget to add (will be shown over "Share" button)
590
- * `options.widgets.mapAttribution` **[string][7]?** Override the default map attribution (read from MapLibre style)
591
- * `options.widgets.iframeBaseURL` **[string][7]?** Set a custom base URL for the "Share as iframe" menu (defaults to current page)
592
-
593
- ### Properties
594
-
595
- * `map` **[Map][2]** The map widget
596
- * `psv` **[Photo][3]** The photo widget
597
-
598
- ### destroy
599
-
600
- Ends all form of life in this object.
601
-
602
- This is useful for Single Page Applications (SPA), to remove various event listeners.
603
-
604
- ### refreshPSV
605
-
606
- Force reload of texture and tiles in Photo Sphere Viewer.
607
-
608
- ### setPopup
609
-
610
- Change full-page popup visibility and content
611
-
612
- #### Parameters
613
-
614
- * `visible` **[boolean][14]** True to make it appear
615
- * `content` **([string][7] | [Array][12]<[Element][8]>)?** The new popup content (optional, default `null`)
616
-
617
- ### playSequence
618
-
619
- Goes continuously to next picture in sequence as long as possible
620
-
621
- ### stopSequence
622
-
623
- Stops playing current sequence
624
-
625
- ### isSequencePlaying
626
-
627
- Is there any sequence being played right now ?
628
-
629
- Returns **[boolean][14]** True if sequence is playing
630
-
631
- ### toggleSequencePlaying
632
-
633
- Starts/stops the reading of pictures in a sequence
634
-
635
- ### moveCenter
636
-
637
- Move the view of main component to its center.
638
- For map, center view on selected picture.
639
- For picture, center view on image center.
640
-
641
- ### moveLeft
642
-
643
- Moves the view of main component slightly to the left.
644
-
645
- ### moveRight
646
-
647
- Moves the view of main component slightly to the right.
648
-
649
- ### moveUp
650
-
651
- Moves the view of main component slightly to the top.
652
-
653
- ### moveDown
654
-
655
- Moves the view of main component slightly to the bottom.
656
-
657
- ### isMapWide
658
-
659
- Is the map shown as main element instead of viewer (wide map mode) ?
660
-
661
- Returns **[boolean][14]** True if map is wider than viewer
662
-
663
- ### getPicturesNavigation
664
-
665
- Get current pictures navigation mode.
666
-
667
- Returns **[string][7]** The picture navigation mode ("any": no restriction, "seq": only pictures in same sequence, "pic": only selected picture)
668
-
669
- ### setPicturesNavigation
670
-
671
- Switch the allowed navigation between pictures.
672
-
673
- #### Parameters
674
-
675
- * `pn` **[string][7]** The picture navigation mode ("any": no restriction, "seq": only pictures in same sequence, "pic": only selected picture)
676
-
677
- ### toggleJOSMLive
678
-
679
- Enable or disable JOSM live editing using [Remote][24]
680
-
681
- #### Parameters
682
-
683
- * `enabled` **[boolean][14]** Set to true to enable JOSM live
684
-
685
- Returns **[Promise][19]** Resolves on JOSM live being enabled or disabled
686
-
687
- ### setFocus
688
-
689
- Change the viewer focus (either on picture or map)
690
-
691
- #### Parameters
692
-
693
- * `focus` **[string][7]** The object to focus on (map, pic)
694
- * `skipEvent` **[boolean][14]** True to not send focus-changed event (optional, default `false`)
695
-
696
- ### toggleFocus
697
-
698
- Toggle the viewer focus (either on picture or map)
699
-
700
- ### setUnfocusedVisible
701
-
702
- Change the visibility of reduced component (picture or map)
703
-
704
- #### Parameters
705
-
706
- * `visible` **[boolean][14]** True to make reduced component visible
707
-
708
- ### toggleUnfocusedVisible
709
-
710
- Toggle the visibility of reduced component (picture or map)
711
-
712
- ### setFilters
713
-
714
- Change the map filters
715
-
716
- #### Parameters
717
-
718
- * `filters` **[object][10]** Filtering values
719
-
720
- * `filters.minDate` **[string][7]?** Start date for pictures (format YYYY-MM-DD)
721
- * `filters.maxDate` **[string][7]?** End date for pictures (format YYYY-MM-DD)
722
- * `filters.type` **[string][7]?** Type of picture to keep (flat, equirectangular)
723
- * `filters.camera` **[string][7]?** Camera make and model to keep
724
- * `filters.theme` **[string][7]?** Map theme to use
725
- * `filters.qualityscore` **[Array][12]<[number][15]>?** QualityScore values, as a list of 1 to 5 grades
726
- * `skipZoomIn` **[boolean][14]** If true, doesn't force zoom in to map level >= 7 (optional, default `false`)
727
-
728
- ### sequence-playing
729
-
730
- Event for sequence starting to play
731
-
732
- ### sequence-stopped
733
-
734
- Event for sequence stopped playing
735
-
736
- ### pictures-navigation-changed
737
-
738
- Event for pictures navigation mode change
739
-
740
- Type: [object][10]
741
-
742
- #### Properties
743
-
744
- * `detail` **[object][10]** Event information
745
-
746
- * `detail.value` **[string][7]** New mode (any, pic, seq)
747
-
748
- ### josm-live-enabled
749
-
750
- Event for JOSM live enabled
751
-
752
- ### josm-live-disabled
753
-
754
- Event for JOSM live disabled
755
-
756
- ### focus-changed
757
-
758
- Event for focus change (either map or picture is shown wide)
759
-
760
- Type: [object][10]
761
-
762
- #### Properties
763
-
764
- * `detail` **[object][10]** Event information
765
-
766
- * `detail.focus` **[string][7]** Component now focused on (map, pic)
767
-
768
- ### filters-changed
769
-
770
- Event for filters changes
771
-
772
- Type: [object][10]
773
-
774
- #### Properties
775
-
776
- * `detail` **[object][10]** Event information
777
-
778
- * `detail.minDate` **[string][7]?** The minimum date in time range (ISO format)
779
- * `detail.maxDate` **[string][7]?** The maximum date in time range (ISO format)
780
- * `detail.type` **[string][7]?** Camera type (equirectangular, flat, null/empty string for both)
781
- * `detail.camera` **[string][7]?** Camera make and model
782
- * `detail.theme` **[string][7]?** Map theme
783
- * `detail.qualityscore` **[Array][12]<[number][15]>?** QualityScore values, as a list of 1 to 5 grades
784
-
785
- [1]: #coreview
786
-
787
- [2]: #map
788
-
789
- [3]: #photo
790
-
791
- [4]: #editor
792
-
793
- [5]: #standalonemap
794
-
795
- [6]: #viewer
796
-
797
- [7]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
798
-
799
- [8]: https://developer.mozilla.org/docs/Web/API/Element
800
-
801
- [9]: https://github.com/radiantearth/stac-api-spec/blob/main/overview.md
802
-
803
- [10]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object
804
-
805
- [11]: https://developer.mozilla.org/en-US/docs/Web/API/fetch#parameters
806
-
807
- [12]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
808
-
809
- [13]: https://maplibre.org/maplibre-gl-js-docs/style-spec/
810
-
811
- [14]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
812
-
813
- [15]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number
814
-
815
- [16]: https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/
816
-
817
- [17]: https://maplibre.org/maplibre-gl-js-docs/api/map/#map-parameters
818
-
819
- [18]: https://maplibre.org/maplibre-style-spec/sources/#raster
820
-
821
- [19]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Promise
822
-
823
- [20]: https://photo-sphere-viewer.js.org/api/classes/core.viewer
824
-
825
- [21]: https://photo-sphere-viewer.js.org/guide/config.html#standard-options
826
-
827
- [22]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
828
-
829
- [23]: #CoreView
830
-
831
- [24]: https://josm.openstreetmap.de/wiki/Help/RemoteControlCommands