动态图
框架支持动态图
支持效果
INFO
支持
代码实例
typescript
<script setup lang="ts" name="初始地形">
import { showCode, closeCode } from '@/utils/store'
import { onMounted, onBeforeUnmount } from 'vue'
import { addCircleScanPostStage } from './CircleDiffusion'
const LarkExplorer = window.LarkExplorer
let map: any
const pos = { x: 112, y: 25, z: 10000 }
onMounted(() => {
LarkExplorer.ready({
baseUrl: './dist/resources/',
}).then(initMap)
})
let obj: any
function initMap() {
// 默认谷歌影像地图
const baseImagery = LarkExplorer.BaseLayer.DefaultTdtImg
// 默认全球地形
// const baseTerrain = LarkExplorer.BaseLayer.DefaultTerrain
// 自定义地形
const baseTerrain = LarkExplorer.BaseLayer.getTerrain(
'https://app.larkview.cn/larkexplorersdk/resources/terrain/'
)
map = new LarkExplorer.Map('map', baseImagery)
console.log(map)
map.Navigation.flyToDegree(pos)
}
const create = () => {
addCircleScanPostStage(map._viewer)
// addSpotlightPostStage(map._viewer)
}
const show = () => {
const code = ``
showCode(code)
}
onBeforeUnmount(() => {
closeCode()
map && map._viewer.destroy()
})
</script>
<template>
<div id="map">
<div class="tools">
<el-button size="small" @click="create">创建</el-button>
</div>
<img
class="code-but"
src="../assets/images/code.png"
@click="show"
title="源码"
/>
</div>
</template>
<style lang="scss" scoped></style>
运行效果
更多示例