🐙WMS图层的加载封装

js
//加载WMS
const initwmslayer = (data, layername) => {
  let url = 'https://www.xxxx.com/geo/geoserver/' + data.ws + '/wms';
// 创建 WMS 图层对象
  let tileLayer = new mars3d.layer.WmsLayer({
    // 图层的 Z 索引，控制图层的叠放顺序，值越大图层越靠前
    zIndex: 1000,
    // 设置图层的 WMS 服务 URL
    url: url,
    // 图层的 ID，通常用于唯一标识图层
    id: layername,

    // 图层的名称，用于显示图层信息
    name: layername,
    // 图层的透明度，取值范围为 0 到 1，0 表示完全透明，1 表示完全不透明
    opacity: 0.5,
    // 需要显示的 WMS 图层名称，`data.url` 为传入的图层名称，`.toLowerCase()` 将其转化为小写
    layers: data.url.toLowerCase(),
    // WMS 图层请求的附加参数
    parameters: {
      // 设置透明背景
      transparent: true,
      // 设置返回的图像格式为 PNG，支持透明背景
      format: 'image/png',
    },
    // 获取要素信息时的参数，限制返回的要素数量
    getFeatureInfoParameters: {
      // 返回的要素数量，设置为 10
      feature_count: 10,
    // 高亮设置，当鼠标悬浮时对图层进行高亮显示
    highlight: {
      // 高亮效果的类型，"wallP" 表示墙面效果
      type: "wallP",
      // 高亮效果的高度差，表示高亮墙面的高度差，越大越突出
      diffHeight: 100,
      // 设置高亮效果的材质类型，这里使用 LineFlow，表示线性流动效果
      materialType: mars3d.MaterialType.LineFlow,
      // 材质的详细选项
      materialOptions: {
        // 使用纹理图片作为墙面效果的纹理图
        image: "img/textures/fence.png",
        // 设置高亮效果的颜色，这里设置为黄色
        color: "#ffff00",
        // 设置线性流动效果的速度，值越大流动速度越快
        speed: 10,
        // 设置是否沿 Y 轴旋转，true 表示沿 Y 轴旋转
        axisY: true
      }
    },
    // 配置弹出框内容，鼠标点击时弹出，显示当前值的属性
    popup: '当前值：{GRAY_INDEX}',
    // 是否自动飞行到该图层，false 表示不自动飞行
    flyTo: false,
    // 是否显示图层，默认不显示
    show: false
  });
  window.map.addLayer(tileLayer)
}