首页 > 解决方案 > “PhotoSphereViewer:无效的 XMP 数据”和“WebGL:INVALID_VALUE:texImage2D:错误的图像数据”

问题描述

我正在使用Photo Sphere Viewer来显示像 facebook 一样的全景照片,但遇到了一些问题。

这是我的代码:

这是我的代码:

<script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8.1.3/dist/polyfill.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/uevent@2.0.0/browser.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.115.0/build/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/photo-sphere-viewer@4/dist/photo-sphere-viewer.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/photo-sphere-viewer@4/dist/photo-sphere-viewer.css">
<div id="photosphere"></div>
<script>
new PhotoSphereViewer.Viewer({
  panorama: 'https://terrafrost.sfo2.digitaloceanspaces.com/20200618_131549.jpg',
  container: 'photosphere',
  caption: 'Parc national du Mercantour <b>&copy; Damien Sorel</b>',
  loadingImg: 'https://terrafrost.sfo2.cdn.digitaloceanspaces.com/photosphere-logo.gif',
  defaultLat: 0.3,
  touchmoveTwoFingers: true,
  mousewheelCtrlKey: true,
});
</script>

当我运行此代码时,我在 JS 控制台中遇到错误:

关于我做错了什么或我需要做什么的任何想法?

谢谢!

标签: javascriptthree.js360-panoramaphotospherephotosphereviewer

解决方案


您的全景文件不是公开的,所以我无法给出完整的答案。但是错误表明嵌入式 XMP 数据不连贯。useXmpData: false您可以使用选项禁用 XMP 解析。

有关 XMP 数据的更多详细信息,请参见https://photo-sphere-viewer.js.org/guide/cropped-panorama.html


推荐阅读