Krpano 开发问题小结

Question

命名问题

krpano 内部在进行字符串比较相等时，有些字符不能进行比较。例如 scene-12 和 scene-12 不相等，因为 - 在 krpano 中解析是有问题的。

krpano 中的名称不能以数字开头，例如场景的 name。

---

全景漫游

全景漫游常见的有点位式漫游和步入式漫游， 点位式漫游通过点位点击进行场景切换。 步入式漫游切换场景时会进行视角的切换，给用户一种行走的感觉。

步入式漫游的全景切图在场景进行加载时，视角会进行相对应地三维偏移，即 tx , ty , tz 变化。 因此普通热点在屏幕和三维的映射关系在步入式漫游中并不生效。 解决这个问题需要将热点的三维偏移和视角的三维偏移保持一致即可。 通过这种设置，无论是热点的展示，还是在编辑器进行拖拽配置都能够正常使用。

备注： krpano 设置视角时，如果 hlookat,vlookat 为 NaN，整个全景页面会崩溃无法使用

---

偶尔有用户会遇到全景无法加载的问题。
原因： google chrome 在更新版本后会对一部分硬件禁用 GPU 功能，导致全景不能正常进行展示

解决办法： 打开 chrome://flags/#ignore-gpu-blocklist ，将 Disabled 改为 Enabled，即可

参考链接： https://krpano.com/forum/wbb/index.php?page=Thread&threadID=16553

---

实例过多问题

由于 webgl 限制，浏览器允许创建的 krpano 实例只有十几个。如果超过数量，则开始创建的全景就会丢失上下文。

当不在需要该实例时，我们立即销毁。krpano 提供 removepano 方法进行销毁实力。

但是在 Vue 的场景下可能存在问题.如果我们在 beforeDestory 中销毁实例，由于销毁实例 需要传入 DOMId, 而在该声明周期无法通过 id 找到 DOM，导致实例销毁失败。

所以在 Vue 场景下，我们需要自己实现方法,通过 ref 传递 DOM

const dom = this.$refs.vrRef.childNodes[0]
const domId = dom.id
if (window._krpMW) {
   const idx = window._krpMW.findIndex(item => item === domId)
   if (idx !== -1) {
         window._krpMW.splice(idx, 1)
    }
   console.log(idx)
}
dom.unload && dom.unload()