vue 加载720全景图

步骤
1.安装photo-sphere-viewer
官网 https://photo-sphere-viewer.js.org/

npm install --save photo-sphere-viewer

2.引入

import 'photo-sphere-viewer/dist/photo-sphere-viewer.css'
import { Viewer } from 'photo-sphere-viewer'

3.主要代码

<div id="viewer720"></div>

showViewer720 () {
    let tempUrl = require('../../public/mp4/yjy.jpg') // 加载720图片地址
    this.viewer = new Viewer({
        container: document.querySelector('#viewer720'),
        panorama: tempUrl
    })
    // 当视图经度和/或纬度改变时触发
    this.viewer.on('position-updated', (e, position) => {
        console.log(`视图经度和/或纬度改变111: ${position.longitude} latitude: ${position.latitude}`,  position.longitude*(Math.PI / 360), position.latitude*(Math.PI / 180))
    })
    // 当缩放级别改变时触发
    this.viewer.on('zoom-updated', (e, level) => {
        console.log(`放级别改变 ${level}`, e)
    })
}