photo sphere viewer是一个js库，用来将全景图片生成360度的全景图像，但是其要求传入的是个路径。如何使用数据代替路径生成图像。
我采用的方法是用img标签生成图像，然后调用img.src来替换path
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Photo Sphere Viewer</title> <meta name="viewport" content="initial-scale=1.0" /> <script src="{{ url_for('static', filename='three.min.js')}}"></script> <script src="{{ url_for('static', filename='photo-sphere-viewer.min.js')}}"></script> <style> html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; } #container { width: 100%; height: 100%; } </style> </head> <body> <div id="container"></div> <img id="image" src="data:image/jpeg;base64,{{ image }}" alt="test"> <script> var div = document.getElementById('container'); var img = document.getElementById('image'); var PSV = new PhotoSphereViewer({ panorama: img.src, container: div, time_anim: 3000, navbar: true, navbar_style: { backgroundColor: 'rgba(58, 67, 77, 0.7)' }, }); </script> </body> </html>
传入的image是经过base64压缩过的图像的数据