开发指南

您当前的位置：首页> JavaScript API 通用版 > 开发指南

6.1 图层概述
6.2 系统图层
6.3 用户图层

图层

6.1 图层概述

我们看到的地图背景、路网、标注、建筑物、路况等都是图层显示，还有用户添加的WMTS、WMS、MVT、 Image等外部数据也是图层显示，图层可以控制是否添加到地图上，控制是否显示还是隐藏

图层	说明
系统图层	地图自带的背景，路网、标注、建筑物、个性建筑、高精度路网等，还有路况、室内图等由地图商自带数据的为系统图层。
用户图层	地图上显示用户动态切片GeoJSON、图片、自定义瓦片、OGC标准WMTS、WMS数据、ThreeJS对象、Canvas自定义画布等用户自己的数据显示为用户图层。

6.2 系统图层

可以添加一个系统图层到地图上。如下面示例：
下面实例一个高精度图层

let hadLayer = new KMap.HadLayer({
   zIndex : 5
});
map.add(hadLayer);

还可以控制显示/隐藏
```
hadLayer.show();
hadLayer.hide();
```
还可以添加一个路况图层到地图上，可以控制路况刷新时间等。如下面示例：
下面实例一个路况图层

let trafficLayer =  new KMap.TrafficLayer({
   autoRefresh: true,
   zIndex: 7
});
map.add(trafficLayer);

还可以控制刷新间隔时间
```
trafficLayer..setInterval(30);
```

6.3 用户图层

可以添加一个自定义瓦片图层地图上，如下面示例：

let tileLayer = new KMap.TileLayer({
     getTileUrl : function (x,y,z) {
         return 'https://my.maptile.com?x='+x+'&y='+y+'&z='+z;
     }
});
map.add(tileLayer);

可以添加一个图片图层地图上，如下面示例：

let imageLayer = new KMap.ImageLayer({
  url : './images/yangtaishan.png',
  bounds : new KMap.Bounds(new KMap.Point(113.96893972,22.67795764),new KMap.Point(114.01196614,22.63031712)),
  zooms: [13, 20]
});
map.add(imageLayer);