antv/L7 mapbox添加google影像底图

一个GIS项目用到了antv/L7,本来打算用leaflet,但上个相似的项目用了antv/L7,这个项目就继续antv/L7了。
客户要求用google影像加注记的底图,且要离线使用,因此一记。
项目是react框架的,因此用到了@antv/l7-react。

详细代码如下:

    <MapboxScene
        className="my-map"
        option={{
          logoVisible: false,
        }}
        map={{
          center: [100.3, 38.5],
          zoom: 6,
          style: {
            version: 8,
            sources: {
              'raster-tiles': {
                type: 'raster',
                tiles: [
                  // mt(0—3) Google地图使用了四个服务地址
                  // lyrs=
                  // m:路线图
                  // t:地形图
                  // p:带标签的地形图
                  // s:卫星图
                  // y:带标签的卫星图
                  // h:标签层(路名、地名等)
                  'https://mt1.google.cn/maps/vt?lyrs=y%40721&hl=zh-CN&gl=CN&x={x}&y={y}&z={z}',
                ],
                tileSize: 256,
              },
            },
            layers: [
              {
                id: 'google',
                type: 'raster',
                source: 'raster-tiles',
                // minZoom: 0,
                // "maxzoom": 18
              },
            ],
          },
        }}
        style={{
          height: '100vh',
        }}
     />
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容