Spaces:
Sleeping
Sleeping
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>ε ¨ζ―εΎζ₯ηε¨</title> | |
| <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pannellum@2.5.6/build/pannellum.css"/> | |
| <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pannellum@2.5.6/build/pannellum.js"></script> | |
| <style> | |
| html, body { | |
| margin: 0; | |
| padding: 0; | |
| width: 100%; | |
| height: 100%; | |
| overflow: hidden; | |
| } | |
| #panorama { | |
| width: 100%; | |
| height: 100%; | |
| } | |
| .pnlm-load-button { | |
| display: none ; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="panorama"></div> | |
| <script> | |
| // ηε¬ζ₯θͺηΆηͺε£ηζΆζ― | |
| window.addEventListener('message', function(event) { | |
| if (event.data.type === 'loadPanorama') { | |
| console.log('Received image URL:', event.data.image); | |
| // ιζ―η°ζηζ₯ηε¨οΌε¦ζεε¨οΌ | |
| if (window.viewer) { | |
| window.viewer.destroy(); | |
| } | |
| // εε»Ίζ°ηζ₯ηε¨ | |
| window.viewer = pannellum.viewer('panorama', { | |
| type: 'equirectangular', | |
| panorama: event.data.image, | |
| autoLoad: true, | |
| autoRotate: -2, | |
| compass: true, | |
| northOffset: 0, | |
| showFullscreenCtrl: true, | |
| showControls: true, | |
| mouseZoom: true, | |
| draggable: true, | |
| friction: 0.2, | |
| minHfov: 50, | |
| maxHfov: 120, | |
| hfov: 100, | |
| onLoad: function() { | |
| console.log('Panorama loaded successfully'); | |
| }, | |
| onError: function(error) { | |
| console.error('Error loading panorama:', error); | |
| } | |
| }); | |
| } | |
| }); | |
| </script> | |
| </body> | |
| </html> |