<template>
<div class="super">
<div id="cesiumContainers" :style="styleObject">
</div>
</div>
</template>
<script>
var Cesium = window.Cesium
var smviewer = window.smviewer
var widget = window.widget
var scene = window.scene
var canvas = window.canvas
var json = require('./spuer.json')
var promiseSet = []
var hasInit = false
// var houseName = ''
export default {
components: {
// screen
},
mixins: [play],
data: function () {
return {
}
},
watch: {
},
created () {
},
mounted () {
this.reloadInterval = setInterval(this.init, 1000)
},
destroyed () {
hasInit = false
},
methods: {
/**
* 三维初始化
* */
init () {
if (hasInit) {
console.log('hasInit')
clearInterval(this.reloadInterval)
return
}
if (!Cesium || !Cesium.Viewer) {
console.log('Cesium null')
Cesium = window.Cesium
return
}
smviewer = new Cesium.Viewer('cesiumContainers', {
shadows: true
})
scene = smviewer.scene
canvas = smviewer.canvas
widget = smviewer.cesiumWidget
var imageryLayers = smviewer.imageryLayers
var baiduLayer = {}
imageryLayers.addImageryProvider(baiduLayer)
// 创建影像图层。打开地图
var promise = smviewer.scene.open('http://www.supermapol.com/realspace/services/3D-OlympicGreenNight/rest/realspace')
Cesium.when(promise, function (layers) {
var x, y, z, heading, pitch, roll, up
x = 113.290549; y = 23.370771; z = 2000.958422
heading = 1.5; pitch = -1.5; roll = 0.1; up = 0.1
// 设置地图镜头位置
smviewer.scene.camera.setView({
/* eslint-disable */
destination: new Cesium.Cartesian3.fromDegrees(x, y, z),
orientation:{
heading: heading,
pitch: pitch,
roll: roll,
up: up
}
})
}, function (e) {
if (widget._showRenderLoopErrors) {
var title = '渲染时发生错误,已停止渲染。'
widget.showErrorPanel(title, undefined, e)
}
})
}
}
}
</script>
<style lang="less" scoped>
#cesiumContainers{
height: 97vh;
z-index: 9999;
}
</style>
详情见https://blog.csdn.net/u013517229/article/details/104752561?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-3.nonecase&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-3.nonecase