├── _config.yml ├── .DS_Store ├── osmtaginfo.json ├── examplepage.css ├── LICENSE ├── basicexample_iframe.html ├── basicexample_canvas_bgcolor.html ├── basicexample_canvas.html ├── basicexample_canvas_telescope.html ├── basicexample_canvas_elevationoffset.html ├── example.css ├── basicexample_links.html ├── basicexample_canvas_astro.html └── README.md /_config.yml: -------------------------------------------------------------------------------- 1 | theme: jekyll-theme-minimal -------------------------------------------------------------------------------- /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Fabiz/PeakFinder-API/HEAD/.DS_Store -------------------------------------------------------------------------------- /osmtaginfo.json: -------------------------------------------------------------------------------- 1 | { 2 | "data_format": 1, 3 | "data_updated": "20231031T000000Z", 4 | "project": { 5 | "name": "PeakFinder", 6 | "description": "360° mountain panoramas and more", 7 | "project_url": "https://www.peakfinder.com", 8 | "icon_url": "https://www.peakfinder.com/favicon-32x32.png", 9 | "contact_name": "Fabio Soldati", 10 | "contact_email": "info@peakfinder.com" 11 | }, 12 | "tags": [ 13 | { "key": "natural", "value": "peak", "object_types": ["node"]}, 14 | { "key": "natural", "value": "volcano", "object_types": ["node"]}, 15 | { "key": "natural", "value": "hill", "object_types": ["node"]} 16 | ] 17 | } -------------------------------------------------------------------------------- /examplepage.css: -------------------------------------------------------------------------------- 1 | body, 2 | button, 3 | input, 4 | optgroup, 5 | select, 6 | textarea { 7 | font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 8 | } 9 | 10 | html, 11 | body, 12 | .container, 13 | .content { 14 | background-color: rgb(248, 248, 248); 15 | } 16 | 17 | h1 { 18 | font-size: 150%; 19 | } 20 | 21 | h2 { 22 | font-size: 100%; 23 | } 24 | 25 | 26 | .content { 27 | } 28 | 29 | header { 30 | padding: 20px 20px; 31 | } 32 | 33 | footer { 34 | padding: 10px 20px; 35 | } 36 | 37 | 38 | header { 39 | font-size: 100%; 40 | height: 80px; 41 | display: flex; /* establish flex container */ 42 | flex-direction: column; /* make main axis vertical */ 43 | justify-content: center; /* center items vertically, in this case */ 44 | align-items: center; /* center items horizontally, in this case */ 45 | } 46 | 47 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright 2023 PeakFinder, www.peakfinder.com 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: 4 | 5 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -------------------------------------------------------------------------------- /basicexample_iframe.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 |
18 | 26 |
27 | Demo Page iFrame 28 |
29 | 30 | 31 |
32 | 33 |
34 | 35 | 36 | 37 | 40 |
41 | 42 | 43 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /basicexample_canvas_bgcolor.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 |
19 | 27 |
28 | Demo Page 29 |
30 | 31 |
32 | 33 | 34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 | 43 | 46 |
47 | 48 | 78 | 79 | 80 | -------------------------------------------------------------------------------- /basicexample_canvas.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 |
19 | 27 |
28 | Demo Page 29 |
30 | 31 |
32 | 33 | 34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 | 43 | 46 |
47 | 48 | 84 | 85 | 86 | -------------------------------------------------------------------------------- /basicexample_canvas_telescope.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 |
19 | 27 |
28 | Demo Page Telescope 29 |
30 | 31 |
32 | 33 | 34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 | 43 | 46 |
47 | 48 | 86 | 87 | 88 | -------------------------------------------------------------------------------- /basicexample_canvas_elevationoffset.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 |
19 | 27 |
28 | Demo Page Elevation offset 29 |
30 | 31 |
32 | 33 | 34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 | 43 | 46 |
47 | 48 | 85 | 86 | 87 | -------------------------------------------------------------------------------- /example.css: -------------------------------------------------------------------------------- 1 | body, 2 | button, 3 | input, 4 | optgroup, 5 | select, 6 | textarea { 7 | font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 8 | } 9 | 10 | html, 11 | body, 12 | .container, 13 | .content { 14 | background-color: rgb(248, 248, 248); 15 | height: 100%; 16 | margin: 0; 17 | } 18 | 19 | h1 { 20 | font-size: 150%; 21 | } 22 | 23 | h2 { 24 | font-size: 100%; 25 | } 26 | 27 | body { 28 | overflow: hidden; 29 | } 30 | 31 | .container { 32 | display: flex; 33 | flex-direction: column; 34 | } 35 | 36 | .content { 37 | position: relative; 38 | } 39 | 40 | canvas { 41 | display: block; /* prevents scrollbar */ 42 | 43 | width: 100%; 44 | height: 100%; 45 | } 46 | 47 | .iframecontainer { 48 | width: 100%; 49 | height: 100%; 50 | } 51 | 52 | header, 53 | footer { 54 | flex-shrink: 0; 55 | } 56 | 57 | header { 58 | padding: 20px 20px; 59 | } 60 | 61 | footer { 62 | padding: 10px 20px; 63 | } 64 | 65 | #canvasoverlay { 66 | position: absolute; 67 | top: 20px; 68 | left: 30px; 69 | } 70 | 71 | header { 72 | font-size: 100%; 73 | height: 80px; 74 | display: flex; /* establish flex container */ 75 | flex-direction: column; /* make main axis vertical */ 76 | justify-content: center; /* center items vertically, in this case */ 77 | align-items: center; /* center items horizontally, in this case */ 78 | } 79 | 80 | footer { 81 | font-size: 80%; 82 | display: flex; /* establish flex container */ 83 | flex-direction: column; /* make main axis vertical */ 84 | justify-content: center; /* center items vertically, in this case */ 85 | align-items: center; /* center items horizontally, in this case */ 86 | } 87 | 88 | .content { 89 | flex-grow: 1; 90 | overflow-y: auto; 91 | min-height: 2em; 92 | border-style: solid; 93 | border-width: 1px 0 1px 0; 94 | border-color: #ccc; 95 | } 96 | 97 | .spinner { 98 | position: fixed; /* or absolute */ 99 | top: 50%; 100 | left: 50%; 101 | margin-left: -35px; 102 | width: 70px; 103 | text-align: center; 104 | } 105 | 106 | .spinner > div { 107 | width: 10px; 108 | height: 10px; 109 | background-color: #555; 110 | 111 | border-radius: 100%; 112 | display: inline-block; 113 | -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both; 114 | animation: sk-bouncedelay 1.4s infinite ease-in-out both; 115 | } 116 | 117 | .spinner .bounce1 { 118 | -webkit-animation-delay: -0.32s; 119 | animation-delay: -0.32s; 120 | } 121 | 122 | .spinner .bounce2 { 123 | -webkit-animation-delay: -0.16s; 124 | animation-delay: -0.16s; 125 | } 126 | 127 | @-webkit-keyframes sk-bouncedelay { 128 | 0%, 129 | 80%, 130 | 100% { 131 | -webkit-transform: scale(0); 132 | } 133 | 40% { 134 | -webkit-transform: scale(1); 135 | } 136 | } 137 | 138 | @keyframes sk-bouncedelay { 139 | 0%, 140 | 80%, 141 | 100% { 142 | -webkit-transform: scale(0); 143 | transform: scale(0); 144 | } 145 | 40% { 146 | -webkit-transform: scale(1); 147 | transform: scale(1); 148 | } 149 | } 150 | -------------------------------------------------------------------------------- /basicexample_links.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 15 |
16 | Demo Page Links 17 |
18 | 19 |
20 | 21 |

Webpage

22 | 23 |

Monadock

24 | 30 | 31 |

Uetliberg

32 | 38 | 39 |
40 |

App

41 | 42 |

Monadock

43 | 49 | 50 |

Uetliberg

51 | 57 |
58 | 59 | 60 | 61 | -------------------------------------------------------------------------------- /basicexample_canvas_astro.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 |
18 | 26 |
27 | Demo Page Astro 28 |
29 | 30 |
31 | 32 | 33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 | 42 | 45 |
46 | 47 | 112 | 113 | 114 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | # PeakFinder-API 3 | 4 | This page contains information about embedding the [PeakFinder](https://www.peakfinder.com) mountain panorama module to your website. 5 | 6 | PeakFinder supports 3 different methods to embed the Panorama Panel to a website: 7 | - Url-Format: Create a link including latitude/longitude and some optional parameters to link to the [PeakFinder](https://www.peakfinder.com) website 8 | - Embed with iFrame: Add an iFrame container to your website with latitude/longitude 9 | - Embed with Canvas: Use Javascript for full control of the Panorama Panel 10 | 11 | ## Url-Format 12 | 13 | PeakFinder provides a simple interface that allows you to create a link to a certain viewpoint or to embed PeakFinder directly on your homepage as an iFrame. 14 | 15 | PeakFinder URL Format 16 | The following link opens the PeakFinder website with the given viewpoint: 17 | https://www.peakfinder.com/?lat=42.8612&lng=-72.109&name=Monadnock&ele=941 18 | 19 | 20 | The following links opens the PeakFinder app with the given viewpoint on your iOS or Android device: 21 | - [peakfinder://?lat=42.8612&lng=-72.109](peakfinder://?lat=42.8612&lng=-72.109) 22 | - [peakfinder://?lat=42.8612&lng=-72.109&name=Monadnock](peakfinder://?lat=42.8612&lng=-72.109&name=Monadnock) 23 | - [peakfinder://?lat=42.8612&lng=-72.109&name=Monadnock&ele=941](peakfinder://?lat=42.8612&lng=-72.109&name=Monadnock&ele=941) 24 | - [peakfinder://?lat=42.8612&lng=-72.109&name=Monadnock&ele=941&off=500](peakfinder://?lat=42.8612&lng=-72.109&name=Monadnock&ele=941&off=500) 25 | 26 | ### Arguments 27 | 28 | Additionally to the required parameters lat and lng you can add the following arguments: 29 | 30 | | Key | Argument | Description | 31 | | -------------| -------- | ---- | 32 | | lat | Latitude (required) | Float value, Wgs84 Format (lat=42.8612) | 33 | | lng | Longitude (required) | Float value, Wgs84 Format (lng=-72.1092) | 34 | | name | Name of the viewpoint (optional) | Text (name=Monadnock%20Mountain), replace spaces with %20 | 35 | | ele | Elevation (optional) | Integer (ele=941) | 36 | | off | Elevation offset (optional) | Integer (off=100) | 37 | | azi | Azimuth (optional) | Float 0.0 .. 360.0 (azi=90.0) | 38 | | alt | Altitude (optional) | Integer -25.0 .. 25.0 (alt=0.0) | 39 | | fov | Field of view (optional) | Integer 8 .. 90.0 (fov=45.0) | 40 | | teleazi & telealt | Azimuth and altitude for displaying the telescope (optional, but both values are required) | Floats 0..360 (teleazi=90.5&telealt=4.5) | 41 | 42 | *** 43 | 44 | ## Embed with iFrame 45 | 46 | With the following code you can embed PeakFinder directly to your homepage. 47 | Check out this example page: [basicexample_iframe.html](https://fabiz.github.io/PeakFinder-API/basicexample_iframe.html). 48 | 49 | 50 | ```html 51 | 55 | ``` 56 | *** 57 | 58 | ## Embed with canvas 59 | 60 | This method gives you the most flexibility. You can use Javascript to control the PeakFinder module. 61 | 62 | Check out this example page: [basicexample_canvas.html](https://fabiz.github.io/PeakFinder-API/basicexample_canvas.html). 63 | \ 64 | \ 65 | You must do the following steps: 66 | - Include Javascript 67 | - Create canvas tag 68 | - Load script 69 | 70 | ### Include Javascript 71 | 72 | Include https://www.peakfinder.com/script/peakfinder.1.0.min.js in your html header: 73 | 74 | ```html 75 | 76 | ```` 77 | 78 | ### Create Canvas Tag 79 | 80 | Add the following canvas tag your your html body: 81 | 82 | ```html 83 |
84 | 85 | 86 | 87 |
88 |
89 |
90 |
91 |
92 | ``` 93 | 94 | ### Load script 95 | 96 | Add the following script to load the module: 97 | 98 | ```javascript 99 | 100 | if (PeakFinder.utils.caniuse()) { 101 | 102 | let panel = new PeakFinder.PanoramaPanel({ 103 | canvasid: 'pfcanvas', 104 | locale: 'en' // attach to canvas 105 | }) 106 | 107 | panel.init(function() { 108 | // inside here its save to use the panel 109 | 110 | panel.settings.distanceUnit(1) // use imperial (miles, feet) format 111 | 112 | panel.loadViewpoint(46.53722, 8.12610, 'Finsteraarhorn') // loads a viewpoint 113 | 114 | // animate to view 115 | panel.azimut(209.0, 2.0) 116 | panel.altitude(1.0, 1.0) 117 | panel.fieldofview(45.0, 2.0) 118 | }); 119 | } 120 | ``` 121 | 122 | 123 | * * * 124 | 125 | # Javascript API Reference 126 | 127 | ## Version 1.0 128 | 129 | 130 | * * * 131 | 132 | ### Functions 133 | 134 | 135 | 136 | ### PeakFinder~PeakFinder : object 137 | Constructor: Initialization of the PeakFinder PanoramaPanel. Pass the options in a Javascript dictionary: 138 | 139 | **Properties** 140 | 141 | | Name | Type | Description | 142 | | --- | --- | --- | 143 | | canvasid | string | The id of the html canvas element. Default: 'canvas' | 144 | | locale | string | The language locale of the module. Default: 'en'. Supported locales: en,de,fr,it,es,pt,ja,ko,zh-Hans,zh-Hant | 145 | | bgcolor | string | A custom color for the background/sky. Normally the sky is white. For another color use the format '#rrggbb' (e.g. #87CEEB for sky color). | 146 | | theme | string | 'dark' for dark-theme. otherwise 'light' theme will be shown | 147 | | disableinfosheets | boolean | Disables showing the poi infosheet or the viewpoint infosheet when the users click on a peak label or the viewpoint | 148 | 149 | **Example** 150 | ```js 151 | let panel = new PeakFinder.PanoramaPanel({ 152 | canvasid: 'pfcanvas', 153 | locale: 'en' 154 | }) // attach to canvas 155 | ``` 156 | 157 | 158 | ### PeakFinder~addEventListener(eventname, callback) 159 | Registers an event listenster that receives events from the PanoramaPanel. 160 | This method must be called after the init() resp. asycinit() methode. 161 | The following events are supported: 162 | - 'viewpointjourney finished' : all data for a new viewpoint has been loaded 163 | - 'viewpoint changed' : viewpoint has changed 164 | - 'sun changed': sun times have beeen changed. 165 | - 'moon changed': moon times have beeen changed. 166 | - 'poiinfo show': user has clicked to a peak name or uses the telescope. 167 | 168 | 169 | | Param | Type | Description | 170 | | --- | --- | --- | 171 | | eventname | string | The name of the event (see list above) | 172 | | callback | function | This function will be called when the requested event is dispached. 'args' will include event data. | 173 | 174 | **Example** 175 | ```js 176 | panel.addEventListener('viewpointjourney finished', async function(args) { 177 | console.log(`viewpoint ready ${JSON.stringify(args)}`) 178 | }) 179 | ``` 180 | 181 | 182 | ### PeakFinder~registerCommandsCallback(command) 183 | Registers a callback that receives commands/messages from the PanoramaPanel. 184 | The PanoramaPanel will send a message when a specific event occured. E.g. when a 185 | new viewpoint was loaded the command: \ 186 | viewpoint changed lat=46.53722&lng=8.12610 \ 187 | will be sent. 188 | Normally register to this callback can be skipped. 189 | 190 | 191 | | Param | Type | Description | 192 | | --- | --- | --- | 193 | | command | function | function must have the format functioname(command). | 194 | 195 | **Example** 196 | ```js 197 | panel.registerCommandsCallback(function(cmd) { 198 | console.log(cmd) 199 | }) 200 | ``` 201 | 202 | 203 | ### PeakFinder~init(callback) 204 | Loads all the needed stuff for displaying the panorama. Call this method only once. 205 | The async callback will inform when the panorama panel is ready. After this call additional 206 | commands like loadViewpoint may be called. 207 | 208 | 209 | | Param | Type | Description | 210 | | --- | --- | --- | 211 | | callback | function | This function will be called when everything is ready | 212 | 213 | **Example** 214 | ```js 215 | panel.init(function() { 216 | console.log('ready') 217 | // inside here you can use panel 218 | panel.loadViewpoint(46.53722, 8.12610, 'Finsteraarhorn') 219 | 220 | }); 221 | ``` 222 | 223 | 224 | ### PeakFinder~asyncinit() 225 | Loads all the needed stuff for displaying the panorama. Call this method only once. 226 | Same as the init function but with support for the Javascript async pattern. After this call additional 227 | commands like loadViewpoint may be called. 228 | 229 | **Example** 230 | ```js 231 | async panel.asyncinit() 232 | 233 | console.log('ready') 234 | panel.loadViewpoint(46.53722, 8.12610, 'Finsteraarhorn') 235 | ``` 236 | 237 | 238 | ### PeakFinder~loadViewpoint(latitude, longitude, the) 239 | Loads a viewpoint with the given coordinates and an optional name 240 | 241 | 242 | | Param | Type | Description | 243 | | --- | --- | --- | 244 | | latitude | number | | 245 | | longitude | number | | 246 | | the | string | viewpoint name. Optional | 247 | 248 | 249 | 250 | ### PeakFinder~viewpointJourneyFinished() ⇒ boolean 251 | Checks if the viewpoint journey has been finished. 252 | 253 | 254 | 255 | ### PeakFinder~azimut(val, animationduration) ⇒ number 256 | Get/set azimut. 257 | 258 | 259 | | Param | Description | 260 | | --- | --- | 261 | | val | The azimut value in degrees | 262 | | animationduration | The duration of the animation. If undefined no animation will be done. | 263 | 264 | **Example** 265 | ```js 266 | await panel.azimut(120.0, 1.0) // set azimut with an animation time of 1 second 267 | 268 | const azimut = panel.azimut() // gets azimut 269 | ``` 270 | 271 | 272 | ### PeakFinder~altitude(val, animationduration) ⇒ number 273 | Get/set altitude. 274 | 275 | 276 | | Param | Description | 277 | | --- | --- | 278 | | val | The altitude value in degrees | 279 | | animationduration | The duration of the animation. If undefined no animation will be done. | 280 | 281 | 282 | 283 | ### PeakFinder~fieldofview(val, animationduration) ⇒ number 284 | Get/set field of view (zoom). 285 | 286 | 287 | | Param | Description | 288 | | --- | --- | 289 | | val | The field of view (zoom) value in degrees | 290 | | animationduration | The duration of the animation. If undefined no animation will be done. | 291 | 292 | 293 | 294 | ### PeakFinder~elevationOffset(val, animationduration) ⇒ number 295 | Get/set elevation offset. 296 | 297 | 298 | | Param | Description | 299 | | --- | --- | 300 | | val | The elevation offset in meters | 301 | | animationduration | The duration of the animation. If undefined no animation will be done. | 302 | 303 | **Example** 304 | ```js 305 | await panel.elevationOffset(200.0, 1.0) // set elevation offset to 200m animation time of 1 second 306 | 307 | const elev = panel.elevationOffset() // gets elevation offset 308 | ``` 309 | 310 | * * * 311 | 312 | ## PeakFinder.settings 313 | 314 | The following setters and getters manage the PeakFinder settings. 315 | 316 | 317 | 318 | ### PeakFinder.Settings~theme() ⇒ number 319 | Get/set theme. \ 320 | 0: light, 1: dark 321 | 322 | **Example** 323 | ```js 324 | panel.settings.theme(1) // set to dark 325 | 326 | const unit = panel.settings.theme() // gets dark 327 | ``` 328 | 329 | 330 | ### PeakFinder.Settings~distanceUnit() ⇒ number 331 | Get/set distance unit. \ 332 | 0: metric, 1: imperial 333 | 334 | **Example** 335 | ```js 336 | panel.settings.distanceUnit(1) // set to imperial 337 | 338 | const unit = panel.settings.distanceUnit() // gets imperial 339 | ``` 340 | 341 | 342 | ### PeakFinder.Settings~coordsFormat() ⇒ number 343 | Get/set the coordinates format. \ 344 | 0: degree (46°30'21"N 8°20'14"E), 1: decimal (46.2412°N 8.1342°E) 345 | 346 | 347 | 348 | ### PeakFinder.Settings~projection() ⇒ number 349 | Get/set the projection. \ 350 | 0: perspective, 1: cylindrical 351 | 352 | 353 | 354 | ### PeakFinder.Settings~showSun() ⇒ number 355 | Get/set display of the sun ecliptic. \ 356 | 0: hide, 1: show 357 | 358 | 359 | 360 | ### PeakFinder.Settings~showMoon() ⇒ number 361 | Get/set display of the moon ecliptic. \ 362 | 0: hide, 1: show 363 | 364 | 365 | 366 | ### PeakFinder.Settings~showGrid() ⇒ number 367 | Get/set display of the coordinate grid. \ 368 | 0: hide, 1: show 369 | 370 | 371 | 372 | ### PeakFinder.Settings~visibilityRange() ⇒ number 373 | Get/set the visiblitiy range in meters. \ 374 | valid range: 0..320000 (320km, 200mil) 375 | 376 | 377 | 378 | ### PeakFinder.Settings~minimalElevation() ⇒ number 379 | Get/set the minimal elevation for the displayed peak names. \ 380 | valid range: 0..10000 (10000m, 32000feet) 381 | 382 | 383 | * * * 384 | 385 | ## PeakFinder.viewpoint 386 | 387 | These methods return information about the current viewpoint. 388 | 389 | 390 | 391 | ### PeakFinder.Viewpoint~name() ⇒ String 392 | Gets the viewpoint name. 393 | 394 | **Returns**: String - the viewpoint name 395 | 396 | 397 | ### PeakFinder.Viewpoint~coordsdecimal() ⇒ String 398 | Gets the viewpoint coordinates in decimal format. 399 | 400 | **Returns**: String - the coordinates in decimal format (e.g. 46.53722°N, 8.12610°E) 401 | 402 | 403 | ### PeakFinder.Viewpoint~coordsdegree() ⇒ String 404 | Gets the viewpoint coordinates in degree format. 405 | 406 | **Returns**: String - the coordinates in degreee format (e.g. 46°32'13''N, 8°07'33''E) 407 | 408 | 409 | ### PeakFinder.Viewpoint~elevation() ⇒ number 410 | Gets the viewpoint elevation in meters. 411 | 412 | **Returns**: number - the elevation in meters 413 | 414 | * * * 415 | 416 | ## PeakFinder.astro 417 | 418 | These methods can be used to set the current date/time and to return sunrise/sunset, moonrise/moonset times. 419 | 420 | 421 | 422 | ### PeakFinder.Astro~currentDateTime(year, month, day, hour, minute) 423 | Sets the date/time for the caluclation of sun and moon times 424 | 425 | 426 | | Param | Type | Description | 427 | | --- | --- | --- | 428 | | year | number | | 429 | | month | number | (1..12) | 430 | | day | number | (1..31) | 431 | | hour | number | | 432 | | minute | number | | 433 | 434 | **Example** 435 | ```js 436 | panel.astro.currentDateTime(2022, 7, 12, 14, 30) 437 | ``` 438 | 439 | 440 | ### PeakFinder.Astro~currentDateTimeNow() 441 | Sets the date/time to now 442 | 443 | 444 | 445 | ### PeakFinder.Astro~sunTimes() ⇒ Object 446 | Gets the time of sunrise, sunset. 447 | 448 | **Returns**: Object - the sun times (e.g. {"sun":{"rise":"2025-04-07T06:50:59Z","set":"2025-04-07T20:11:59Z"}} ) 449 | 450 | 451 | ### ~~PeakFinder.Astro~sunTimes() ⇒ String~~ 452 | ***Use method sun instead*** 453 | 454 | Gets the time of sunrise, sunset. 455 | 456 | **Returns**: String - the times (e.g. '↑05:54, ↓21:17') 457 | 458 | 459 | ### PeakFinder.Astro~moon() ⇒ Object 460 | Gets the time of moonrise, moonset. 461 | 462 | **Returns**: Object - the sun times (e.g. {"moon":{"illum":"74.7%"},"sun":{"rise":"2025-04-07T14:11:59Z","set":"2025-04-08T05:32:59Z"}} 463 | 464 | 465 | ### ~~PeakFinder.Astro~moonTimes() ⇒ String~~ 466 | ***Use method moon instead*** 467 | 468 | Gets the time of moonrise, moonset. 469 | 470 | **Returns**: String - the times (e.g. '↑07:13, ↓22:33, 3.4%') 471 | 472 | * * * 473 | 474 | ## PeakFinder.telescope 475 | 476 | These methods can be used to show/hide telescope and get azimut, altitude, distance and elevation. 477 | 478 | 479 | 480 | ### PeakFinder.Telescope~show() 481 | Shows the telescope 482 | 483 | **Example** 484 | ```js 485 | panel.telescope.show() 486 | ``` 487 | 488 | 489 | ### PeakFinder.Telescope~hide() 490 | Hide the telescope 491 | 492 | 493 | 494 | ### PeakFinder.Telescope~centerAzimut() ⇒ Number 495 | Get the azimut of the telecope center 496 | 497 | **Returns**: Number - azimut 498 | 499 | 500 | ### PeakFinder.Telescope~centerAltitude() ⇒ Number 501 | Get the altitude of the telecope center 502 | 503 | **Returns**: Number - altitude 504 | 505 | 506 | ### PeakFinder.Telescope~centerDistance() ⇒ Number 507 | Get the distance of the telecope center 508 | 509 | **Returns**: Number - distance 510 | 511 | 512 | ### PeakFinder.Telescope~centerElevation() ⇒ Number 513 | Get the elevation of the telecope center 514 | 515 | **Returns**: Number - elevation 516 | 517 | * * * 518 | 519 | ## PeakFinder.utils 520 | 521 | The following static util functions may be used for the initialization of the module. 522 | 523 | 524 | 525 | ### PeakFinder.utils.caniuse() ⇒ Boolean 526 | Checks if the browser supports the required technoligies to display the PeakFinder PanoramaPanel. 527 | 528 | **Returns**: Boolean - True if showing PeakFinder module is supported 529 | 530 | 531 | ### PeakFinder.utils.isTouchDevice() ⇒ Boolean 532 | Checks if device has a touch screen. 533 | 534 | **Returns**: Boolean - True if its a touch device 535 | 536 | 537 | ### PeakFinder.utils.hasMultiThreadingSupport() ⇒ Boolean 538 | Checks if browser supports multithreading. 539 | 540 | **Returns**: Boolean - True if multithreading is available 541 | 542 | 543 | ### PeakFinder.utils.sleep(timeout) 544 | Non-blocking sleep function. Use this function to wait for a result of an async call. 545 | 546 | 547 | | Param | Type | Description | 548 | | --- | --- | --- | 549 | | timeout | number | in seconds | 550 | 551 | **Example** 552 | ```js 553 | panel.astro.currentDateTime(2022, 7, 12, 14, 30) 554 | 555 | // it takes a moment until the suntimes are evaluated. so sleep for a second. 556 | await PeakFinder.utils.sleep(1.0) 557 | console.log(panel.astro.sunTimes()) 558 | ``` 559 | 560 | * * * 561 | 562 | 563 | @ [https://www.peakfinder.com](www.peakfinder.com) --------------------------------------------------------------------------------