maptalks

• 安装插件
• 创建地图实例
• 创建数据源
• 创建图层
• 示例

安装插件

npm

$ npm add @sakitam-gis/maptalks-wind

pnpm

$ pnpm add @sakitam-gis/maptalks-wind

yarn

$ yarn add @sakitam-gis/maptalks-wind

script

<script src="https://unpkg.com/@sakitam-gis/maptalks-wind/dist/maptalks-wind.js"></script>

创建地图实例

当我们准备好相关依赖后就可以进行地图和图层的创建了

ts

import maptalks from 'maptalks';

const map = new maptalks.Map(mapRef.value, {
    zoom: 2,
    center: [34.371, 131.287].reverse(),
    baseLayer: new maptalks.TileLayer('base', {
      urlTemplate: 'https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png',
      // urlTemplate: 'https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png',
      subdomains: ['a', 'b', 'c', 'd'],
      repeatWorld: 'x',
    })
});

创建数据源

参考 mapbox-gl 的使用，关于数据源和图层的创建这块的 api 基本保持了一致。

创建图层

参考 mapbox-gl 的使用，关于数据源和图层的创建这块的 api 基本保持了一致。

示例

TIP

灰度图瓦片数据