test2.jpeg
用插件photo-sphere-viewer發(fā)現(xiàn)有問(wèn)題库物，圖片過(guò)大北救，c盤(pán)內(nèi)存小于大概5G就不行规哲，加載不出來(lái)喷鸽，可能圖片預(yù)加載，具體搞不清楚鸽斟，所以自己寫(xiě)了一個(gè)至壤，還是可以加載的
image.png
image.png
具體代碼：https://github.com/cloveryuan/photo_viewer/tree/main
使用：
- 代碼是一個(gè)組件减噪，傳入圖片路徑就可以了
- 遇到的問(wèn)題厦凤，如果一個(gè)頁(yè)面有兩個(gè)地方用的同一張圖報(bào)錯(cuò)
Failed to execute 'texImage2D' on 'WebGL2RenderingContext': Overload resolut
每次傳照片路徑的地方鼻吮，在路徑后面加入時(shí)間戳就可以解決了
//引入組件photo，傳入bigImg
<el-dialog
:title="photoSphereName"
:visible.sync="visible"
:footer="false"
:append-to-body="true"
custom-class="photo_wrap"
width="70%">
<photo :bigImg="bigImg" v-if="visible"></photo>
</el-dialog>
//調(diào)用全景圖的方法较鼓，img是傳入的路徑椎木，如果不會(huì)重復(fù)圖片可以不加時(shí)間戳
initPhotoSphere(name, img) {
// img = img.replace('http://36.133.34.40:82/', '') + '?' + new Date().getTime()//解決跨域的
img = img + '?' + new Date().getTime()
this.photoSphereName = name
this.visible = true
this.bigImg = img
//這下面是以前使用photo-sphere-viewer的方法违柏，不必看
// if (this.viewer) {
// this.viewer.destroy()
// }
// this.$nextTick(() => {
// this.viewer = new Viewer({
// container: document.querySelector('#viewer'),
// panorama: img,
// size: {
// width: '100%',
// height: '60vh'
// }
// })
// })
}
