javascript - “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>© Damien Sorel</b>',
loadingImg: 'https://terrafrost.sfo2.cdn.digitaloceanspaces.com/photosphere-logo.gif',
defaultLat: 0.3,
touchmoveTwoFingers: true,
mousewheelCtrlKey: true,
});
</script>
当我运行此代码时,我在 JS 控制台中遇到错误:
- PhotoSphereViewer:无效的 XMP 数据(来自 psv.js:11)
- WebGL:INVALID_VALUE:texImage2D:错误的图像数据(来自three.min.js:130)
关于我做错了什么或我需要做什么的任何想法?
谢谢!
解决方案
您的全景文件不是公开的,所以我无法给出完整的答案。但是错误表明嵌入式 XMP 数据不连贯。useXmpData: false
您可以使用选项禁用 XMP 解析。
有关 XMP 数据的更多详细信息,请参见https://photo-sphere-viewer.js.org/guide/cropped-panorama.html
推荐阅读
- json - 从Angular中的“Firebase实时数据库”获取多次嵌套的数据
- angular10 - Angular 9 到 10 解决方案样式 tsconfig.json 应该在升级之前或之后创建
- azure-devops - 使用 Azure DevOps Pipeline 任务发布 NPM 包:ArtifactoryNpm@2 到 Artifactory
- spring-data-jpa - Spring数据——按不同命名的复合主键排序
- mysql - 如果满足每个条件的一个条件,则列出所有值
- python - 运行python代码后如何修复CMD卡住
- database - 关系数据库中的功能依赖是可逆的吗?
- android - 如何从主机名中提取网站名称
- unit-testing - 在测试中捕获方法参数
- firebase - Firebase 不返回用户