1、下载PanoLens.js与three.js
1.下载 [PanoLens.js]
链接：https://pan.baidu.com/s/10XwXAT57JXXfkU0YDIfgxw
提取码：1111
2.通过npm i three安装three.js
2、引入
import * as PanoLens from '@/assets/panolens/panolens';
3、 使用
<template>
<div class="panolens-container" style="height:90vh">
</div>
</template>
<script>
import * as PanoLens from '@/assets/panolens/panolens2';
export default {
name: '',
components: {},
data() {
return {
viewer: null,
littlePlanet: null
}
},
props: {},
mounted() {
this.init()
},
methods: {
init() {
this.viewer = new PanoLens.Viewer({
controlBar: false,
container: this.$el,
cameraFov: 100
});
this.littlePlanet = new PanoLens.ImageLittlePlanet(require('@/assets/360.jpg'));
this.viewer.add(this.littlePlanet);
}
}
}
</script>
<style lang='scss' scoped>
</style>
注意：three版本必须是0.105.2
