openlayer的遮罩效果不显示问题

###一开始使用遮罩效果的代码如下： >

   initMap(){
   、、、省略地图地图创建、、、
   const mystyle = new Style({
        fill: new Fill({
          color: 'rgba(204,204,204, 0.5)',
        }),
        stroke: new Stroke({
          color: '#BDBDBD',
          width: 2
        }),
      });
      //遮罩图层
      var converLayer = new VectorLayer({
        source: new VectorSource(),
        style: mystyle
      });
      this.map.addLayer(converLayer);
      this.addConver(converLayer, this.ceshi);
    },

//增加遮罩
addConver(converLayer, data) {
  const fts = new GeoJSON().readFeatures(data);
  const ft = fts[0];
    const converGeom = this.erase(ft.getGeometry());
    const convertFt = new Feature({
      geometry: converGeom,
    });
    converLayer.getSource().addFeature(convertFt);
  })

},
//擦除操作，生产遮罩范围
erase(geom) {
const extent: any = [-180, -90, 180, 90];
const polygonRing = fromExtent(extent);

const coords = geom.getCoordinates();
// tslint:disable-next-line: prefer-for-of
for (let i = 0; i < coords.length; i++) {
  const linearRing = new LinearRing(coords[i]);
  polygonRing.appendLinearRing(linearRing);
}
return polygonRing;
}``

### 但结果遮罩无效果：
1.排查原因要根据json数据的几何类型问题进行排查，我的出错问题就是geom的打印几何类型是MultiLineString，但要呈现遮罩效果，geom的几何类型格式需要是MultiPolygon或者Polygn，所以要进行转换才能呈现效果
即修改后的代码为：

`//增加遮罩
addConver(converLayer, data) {
  const fts = new GeoJSON().readFeatures(data);
  fts.forEach(ft => {
    const geom = ft.getGeometry();
    // 将 MultiLineString 转换为 MultiPolygon --- 将多线字符串转换为多边形
    if (geom instanceof MultiLineString) {
      const coordinates = geom.getCoordinates();
      const polygons = coordinates.map(coords => new Polygon([coords]));
      ft.setGeometry(new MultiPolygon(polygons));
    }
    const converGeom = this.erase(ft.getGeometry());
    const convertFt = new Feature({
      geometry: converGeom,
    });
    converLayer.getSource().addFeature(convertFt);
  })
}`
2.排查原因要根据json的坐标系进行排查
我的json的坐标系是epsg：4326，但我用的地图是epsg：3857，结果导致遮罩不显示
需将地图和json的坐标系一致显示