export default class newfiberMapBoxVectorLayer {
  //添加circle
  static addGeojsonCircle(layerId, geojson, minzoom) {
    if (!newfiberMapbox.map.getLayer(layerId)) {
      newfiberMapbox.map.addSource(layerId, {
        type: 'geojson',
        data: geojson,
      });
      newfiberMapbox.map.addSource(layerId + '_label', {
        type: 'geojson',
        data: geojson,
      });
      newfiberMapbox.map.addLayer({
        id: layerId,
        type: 'circle',
        source: layerId,
        paint: {
          'circle-color': ['get', 'fillcolor'],
          'circle-radius': 10,
        },
      });
      newfiberMapbox.map.addLayer({
        id: layerId + '_label',
        type: 'symbol',
        minzoom: minzoom ? minzoom : 0,
        source: layerId + '_label',
        paint: {
          'text-color': 'rgba(255, 255, 255, 1)',
          'text-halo-color': 'rgba(14, 139, 90, 1)',
          'text-halo-width': 2,
        },
        layout: {
          'text-field': '{name}',
          'text-font': ['KlokanTech Noto Sans Regular'],
          'text-size': 16,
          'text-line-height': 3,
          'text-anchor': 'bottom',
          'text-max-width': 50,
        },
      });
    }
  }

  //添加geojson Symbol
  static addGeojsonSymbol(layerId, geojson, icon) {
    if (!newfiberMapbox.map.getLayer(layerId)) {
      newfiberMapbox.map.loadImage(icon, (error, image) => {
        if (error) throw error;

        // Add the image to the map style.
        newfiberMapbox.map.addImage(layerId, image);

        // Add a data source containing one point feature.
        newfiberMapbox.map.addSource(layerId, {
          type: 'geojson',
          data: geojson,
        });
        newfiberMapbox.map.addLayer({
          id: layerId,
          type: 'symbol',
          source: layerId,
          paint: {
            'text-color': 'rgba(255, 255, 255, 1)',
            'text-halo-color': 'rgba(14, 139, 90, 1)',
            'text-halo-width': 2,
          },
          layout: {
            'icon-image': layerId,
            'text-allow-overlap': true,
            'icon-allow-overlap': true,
            'icon-anchor': 'center',
            'icon-size': 0.8,
            'text-field': '{name}',
            'text-font': ['KlokanTech Noto Sans Regular'],
            'text-size': 16,
            'text-line-height': 3,
            'text-anchor': 'bottom',
            'text-max-width': 50,
            'text-offset': [0, 3],
          },
        });
      });
    }
  }
  //添加geojson线
  static addGeojsonLine(layerId, geojson, lineWidth, lineOpacity, lineBlur) {
    if (!newfiberMapbox.map.getLayer(layerId)) {
      newfiberMapbox.map.addSource(layerId, {
        type: 'geojson',
        data: geojson,
      });
      newfiberMapbox.map.addLayer({
        id: layerId,
        type: 'line',
        source: layerId,
        paint: {
          'line-color': ['get', 'fillcolor'],
          'line-width': lineWidth ? lineWidth : 3,
          'line-opacity': lineOpacity ? lineOpacity : 1,
          'line-blur': lineBlur ? lineBlur : 0,
        },
      });
    }
  }
  //添加有标注的geojson线
  static addGeojsonLineWithLabel(layerId, geojson, lineWidth, minzoom) {
    let labelGeojson = this.getGeojsonCenterPoint(geojson);
    if (!newfiberMapbox.map.getLayer(layerId)) {
      newfiberMapbox.map.addSource(layerId, {
        type: 'geojson',
        data: geojson,
      });
      newfiberMapbox.map.addSource(layerId + '_label', {
        type: 'geojson',
        data: labelGeojson,
      });
      newfiberMapbox.map.addLayer({
        id: layerId,
        type: 'line',
        source: layerId,
        paint: {
          'line-color': ['get', 'fillcolor'],
          'line-width': lineWidth ? lineWidth : 3,
        },
      });
      newfiberMapbox.map.addLayer({
        id: layerId + '_label',
        type: 'symbol',
        minzoom: minzoom ? minzoom : 0,
        source: layerId + '_label',
        paint: {
          'text-color': 'rgba(255, 255, 255, 1)',
          'text-halo-color': 'rgba(14, 139, 90, 1)',
          'text-halo-width': 2,
        },
        layout: {
          'text-field': '{name}',
          'text-font': ['KlokanTech Noto Sans Regular'],
          'text-size': 16,
          'text-line-height': 3,
          'text-anchor': 'bottom',
          'text-max-width': 50,
        },
      });
    }
  }
  //添加geojson面
  static addGeojsonPolygon(layerId, geojson) {
    if (!newfiberMapbox.map.getLayer(layerId)) {
      newfiberMapbox.map.addSource(layerId, {
        type: 'geojson',
        data: geojson,
      });

      newfiberMapbox.map.addLayer({
        id: layerId,
        type: 'fill',
        source: layerId,
        paint: {
          'fill-color': ['get', 'fillcolor'] || 'rgba(154,104,171,0.8)',
        },
      });
    }
  }

  //添加有标注的geojson面
  static addGeojsonPolygonWithLabel(layerId, geojson, minzoom) {
    let labelGeojson = this.getGeojsonCenterPoint(geojson);
    if (!newfiberMapbox.map.getLayer(layerId)) {
      newfiberMapbox.map.addSource(layerId, {
        type: 'geojson',
        data: geojson,
      });
      newfiberMapbox.map.addSource(layerId + '_label', {
        type: 'geojson',
        data: labelGeojson,
      });
      newfiberMapbox.map.addLayer({
        id: layerId,
        type: 'fill',
        source: layerId,
        paint: {
          'fill-color': ['get', 'fillcolor'],
        },
      });
      newfiberMapbox.map.addLayer({
        id: layerId + '_label',
        type: 'symbol',
        source: layerId + '_label',
        minzoom: minzoom ? minzoom : 0,
        paint: {
          'text-color': 'rgba(255, 255, 255, 1)',
          'text-halo-color': 'rgba(14, 139, 90, 1)',
          'text-halo-width': 2,
        },
        layout: {
          'text-field': '{name}',
          'text-font': ['KlokanTech Noto Sans Regular'],
          'text-size': 16,
          'text-line-height': 3,
          'text-anchor': 'bottom',
          'text-max-width': 50,
        },
      });
    }
  }
  //获取geojson中心点
  static getGeojsonCenterPoint(geojson) {
    let features = [];
    geojson.features.forEach(element => {
      let feature = turf.center(element, element);
      features.push(feature);
    });
    return {
      type: 'FeatureCollection',
      features: features,
    };
  }
  //添加image图层
  static addImageToMap(layerId, coordinates, imageUrl) {
    if (!newfiberMapbox.map.getLayer(layerId)) {
      newfiberMapbox.map.addSource(layerId, {
        type: 'image',
        url: imageUrl,
        coordinates: coordinates,
      });
      newfiberMapbox.map.addLayer({
        id: layerId,
        type: 'raster',
        source: layerId,
        paint: {},
      });
    }
  }
  //添加geoserver图层
  static addWMSLayer(layerName) {
    if (!newfiberMapbox.map.getLayer(layerName)) {
      newfiberMapbox.map.addSource(layerName, {
        type: 'raster',
        // use the tiles option to specify a WMS tile source URL
        // https://docs.mapbox.comhttps://docs.mapbox.com/style-spec/reference/sources/
        tiles: [
          '/geoserver/demo/wms?bbox={bbox-epsg-3857}&format=image/png&service=WMS&version=1.1.1&request=GetMap&srs=EPSG:3857&transparent=true&width=256&height=256&' +
            `layers=${layerName}`,
        ],
        tileSize: 256,
      });
      newfiberMapbox.map.addLayer({
        id: layerName,
        type: 'raster',
        source: layerName,
        paint: {},
      });
    }
  }
  //移除图层
  static removeByIds(layernameList) {
    layernameList.forEach(layerName => {
      if (newfiberMapbox.map.getLayer(layerName)) {
        newfiberMapbox.map.removeLayer(layerName);
        newfiberMapbox.map.removeSource(layerName);
      }
      if (newfiberMapbox.map.getSource(layerName)) {
        newfiberMapbox.map.removeLayer(layerName);
        newfiberMapbox.map.removeSource(layerName);
      }
    });
  }
}