MapboxRasterLayer
栅格瓦片图层,叠加 XYZ/TMS 模板的外部瓦片服务。
简介
MapboxRasterLayer 叠加外部栅格瓦片服务({z}/{x}/{y} 模板 URL),支持 tileSize / scheme / minzoom / maxzoom / attribution / opacity。天地图等国内底图见 扩展能力。
用法
在空样式底图上叠加 OpenStreetMap 瓦片:
<script setup lang="ts">
const tiles = ['https://tile.openstreetmap.org/{z}/{x}/{y}.png']
</script>
<template>
<div class="h-115 w-full overflow-hidden rounded-(--ui-radius) border border-default">
<!-- 空样式底图,仅叠加外部栅格瓦片 -->
<MapboxMap
:options="{ style: 'mapbox://styles/mapbox/empty-v9', center: [116.4, 39.9], zoom: 9 }"
>
<MapboxRasterLayer
:tiles="tiles"
:tile-size="256"
attribution="© OpenStreetMap contributors"
/>
</MapboxMap>
</div>
</template>
API
Props
| Prop | Default | Type |
|---|---|---|
tiles | string[]URL 模板瓦片地址({z}/{x}/{y} 占位) | |
layerId | string图层 id;省略时自动生成 | |
tileSize | 256 | number瓦片尺寸 |
scheme | 'xyz' | "xyz" | "tms"瓦片坐标方案 |
minzoom | number数据源最小缩放级别 | |
maxzoom | number数据源最大缩放级别 | |
attribution | string版权信息 | |
opacity | 1 | number不透明度 |
beforeId | string插入到该图层之前 |
Changelog
No recent changes