VFullscreenControl

VFullscreenControl 控件用于控制地图的全屏显示。

• 配置文档

提示

如果在不支持 requestFullScreen() 的浏览器中使用该控件将隐藏自身。

基础用法

fullscreen-control.vue

<script lang="ts" setup>
import { getTdtRandomToken } from '@movk-repo/libs'
import { VFullscreenControl, VMapbox, VTianditu } from '@movk-repo/mapbox'

const accessToken = import.meta.env.VITE_MAPBOX_ACCESS_TOKEN
const token = getTdtRandomToken()
</script>

<template>
  <VMapbox :access-token="accessToken">
    <VTianditu type="ter_w" :token="token" />
    <VFullscreenControl />
  </VMapbox>
</template>

隐藏源代码

API

fullscreenControlProps

属性名	说明	类型	默认值
position	控件位置	string	top-left
container	控件容器	HTMLElement	-

fullscreenControlEmits

事件名	说明	回调参数
add	控件添加完成后触发	Function
remove	控件移除完成后触发	Function

类型定义

FullscreenControlLoadEvent

control/FullscreenControl/FullscreenControl.ts

export interface FullscreenControlLoadEvent {
  type: 'fullscreen'
  control: FullscreenControl
  map: Map
}