YY. LayerLookup

TileLayer 创建代理类，主要用来创建 TileLayer 实例

creation

• constructor()

example

var googleTileLayer = YY.LayerLookup.lookup("google");
map.addBaseLayer(googleTileLayer);

var googleTileLayer1 = YY.LayerLookup.lookup("google", {
    style: "image"
});
map.addBaseLayer(googleTileLayer1);

var tileLayer = YY.LayerLookup.createTileLayer(
    "http://a.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png", {
        maxBounds: [
            [-180, -90],
            [180, 90],
        ],
        minZoom: 4,
        preview: "./../assets/images/3.png",
    }
);
map.addBaseLayer(tileLayer);

method

TIP

static 表示静态方法, 即对象直接访问, 无需new

static lookup(type, [options])

demo

• 快速获取一个瓦片图层，这里的瓦片的图层都是内置，一般是互联网上的资源
• 参数
  • {String} type : 'baidu','amap','tdt','google',支持快速创建 百度，高德，天地图，谷歌地图
  • {Object} options:支持设置样式
• 返回值： YY. TileLayer

var tdtTileLayer = YY.LayerLookup.lookup("tdt"); //默认的天地图
map.addBaseLayer(tdtTileLayer);

var tdtTileLayer1 = YY.LayerLookup.lookup("tdt", {
    style: "image"
}); //天地图影像图
map.addBaseLayer(tdtTileLayer1);

var googleTileLayer = YY.LayerLookup.lookup("google"); //谷歌
map.addBaseLayer(googleTileLayer);

var googleTileLayer1 = YY.LayerLookup.lookup("google", {
    style: "image"
});
map.addBaseLayer(googleTileLayer1);

var amapTileLayer = YY.LayerLookup.lookup("amap"); //高德
map.addBaseLayer(amapTileLayer);

var amapTileLayer1 = YY.LayerLookup.lookup("amap", {
    style: "image"
});
map.addBaseLayer(amapTileLayer1);

var baiduTileLayer = YY.LayerLookup.lookup("baidu"); //百度
map.addBaseLayer(baiduTileLayer);

var baiduTileLayer1 = YY.LayerLookup.lookup("baidu", {
    style: "image"
});
map.addBaseLayer(baiduTileLayer1);

static createTileLayer(url, opts = {}, crs)

demo

• 创建一个瓦片图层，如果当我们要加载自定义的瓦片图层时可以用这个方法，比如第三方提供的地图
• 参数
  • {String} url : 瓦片地址
  • {Object} options:图层基本信息
  • {Object} crs:空间投影信息
• 返回值： YY. TileLayer

        //演示加载自定义的瓦片图层，这里以天地图为例子，项目中一般都是用这种方式

        var origin = [-180, 90]; //天地图的切图原点
        var res = function() { //切图参数
            var ss = [];
            for (var i = 0; i <= 18; i++) {
                ss.push(1.40625 / Math.pow(2, i));
            }
            return ss;
        }();

        var crs = { //构造空间投影信息
            origin: origin,
            resolutions: res,
            code: 'ESPG:4326' //84坐标系，经纬度投影

        }

        let options1 = { //地图的基本信息
            minZoom: 1,
            maxZoom: 18,
            maxBounds: [
                [-180, -90],
                [180, 90]
            ]
            preview: '../assets/image/preview.png'
        }

        //利用YY.LayerLookup.createTileLayer 加载天地图，
        var tileLayer1 = YY.LayerLookup.createTileLayer('http://t0.tianditu.com/img_c/wmts?SERVICE=WMTS&VERSION=1.0.0&REQUEST=GetTile&FORMAT=tiles&TILEMATRIXSET=c&STYLE=default&LAYER=img&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}', options1, crs);

        map.addBaseLayer(tileLayer1);

static createBusinessTileLayer(url, opts = {}, crs)

• 创建一个业务的动态瓦片图层，一般用于大数据的矢量切片
• 参数
  • {String} url : 瓦片地址
  • {Object} options:图层基本信息
  • {Object} crs:空间投影信息
• 返回值： YY. TileLayer

  let googleTileLayer = YY.LayerLookup.lookup("google");

  let attribute = {
      name: "hello"
  };
  let businessTileLayer = YY.LayerLookup.createBusinessTileLayer(
      "http://localhost:1350/test", {
          attribute: attribute
      }
  );
  googleTileLayer.group(businessTileLayer);

  map.addBaseLayer(googleTileLayer);