openlayers 调用天地图 wmts 服务配置

1,083 阅读2分钟
  // 天地图 wmts 配置
  var projection = ol.proj.get("EPSG:4326"); //设置坐标系
  var projectionExtent = projection.getExtent();
  //分辨率

//   下面这个maxtrixIdx 一定要和 resolutions 的数量length对应,这个多少个,分辨率resolution就要多少个,
//    然后,这个的里面0,1,2,3 对应 wmts服务能力文档的 <ows:Identifier> 参数,一般是数字,或者’变量+_5‘,数字等,
//     resolution 则是可以多个图层公用一个分辨率
  var matrixIds = [
    0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20,
  ];
  var resolutions = [
    1.40625, 0.703125, 0.3515625, 0.17578125, 0.087890625, 0.0439453125,
    0.02197265625, 0.010986328125, 0.0054931640625, 0.00274658203125,
    0.001373291015625, 0.0006866455078125, 0.00034332275390625,
    0.000171661376953125, 0.0000858306884765625, 0.00004291534423828125,
    0.000021457672119140625, 0.000010728836059570312, 0.000005364418029785156,
    0.000002682209014892578, 0.000001341104507446289,
  ];

  var guangdongwmts = new ol.layer.Tile({
    title: '广东省天地图的测试',  // 图层切换控件的名称
    source: new ol.source.WMTS({
      name: "广东测试",
      url: "https://guangdong.tianditu.gov.cn/ResourcesProxy/nbmrivqdag/geostar/DOM_2000_2021_2M_1_GK/wmts",
      layer: "DOM_2000_2021_2M_1_GK", // 对应能力文档的 <Layer> 》》》 <ows:Title>
      style: "default",
      matrixSet: "DOM_2000_2021_2M_1_GK_Matrix_0", // 对应能力文档的 <TileMatrixSet> >>>>>> <ows:Identifier> 可能有多个
      format: "image/tile",    // 对应 能力文档的 <TileMatrix> >>>>>> <Format>
      wrapX: true, //地图缩小后,防止在一个页面出现多个一样的地图
      tileGrid: new ol.tilegrid.WMTS({
        origin: ol.extent.getTopLeft(projectionExtent),
        resolutions: resolutions.slice(7, 17), 
        matrixIds: matrixIds.slice(7, 17),
        //  上面这两个很重要,一定要数量对应且,分辨率对下面mat这个层级也要对应,
        //  比如,mat第一个数字是7,那么res第一个也要是第7层级的分辨率,
      }),
    }),
    maxResolution: resolutions[13], 
    minResolution: resolutions[17],
    // 这个max和min的意思是,超过这个分辨率,还显不显示, 比如我们的图层只有14~17,
    // 如果不加这个,当我们放大到18层的时候,图层依然是17层的放大,那么画面自然模糊,
    // 所以业务上需要做无缝切换的最好换上即可,这样的话,也不用考虑图层的z-index的覆盖问题,一举两得
    // 比如可以限制免费地图的1~16层,剩下17~20就用业务开发的即可
  });