Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <title>owl-sdk · minimal example</title> | |
| <style> | |
| body { margin: 0; font-family: system-ui, sans-serif; background: #0b1020; color: #e6e9f2; } | |
| header { padding: 14px 20px; background: #121830; border-bottom: 1px solid #1f2845; | |
| font-size: 14px; } | |
| #map { width: 100%; height: calc(100vh - 50px); } | |
| a { color: #7dd3fc; } | |
| </style> | |
| </head> | |
| <body> | |
| <header> | |
| owl-sdk minimal example — | |
| <a href="/v1/docs">API docs</a> · | |
| <a href="/sdk.js">SDK source</a> · | |
| <a href="/explore">Full explorer</a> | |
| · click any dot or click anywhere on the map (check the console) | |
| </header> | |
| <div id="map"></div> | |
| <script src="/sdk.js"></script> | |
| <script> | |
| (async function () { | |
| const m = await OWL.map('#map'); | |
| await m.addStationLayer(); | |
| m.on('stationClick', s => { | |
| console.log('station picked:', s); | |
| alert(s.id + ' — ' + (s.name || '(no name)')); | |
| }); | |
| })(); | |
| </script> | |
| </body> | |
| </html> | |