csk-gis-frame-work 4.0.0

package/mapboxgl/js/pipeline/PipenetErrorProvider.js

@@ -0,0 +1,352 @@
+import DataUtils from "../utils/DataUtils";
+import VerifyUtils from "../utils/VerifyUtils";
+import GeoJsonProvider from "../geog/GeoJsonProvider";
+import SimpleLineLayer from "../common/SimpleLineLayer";
+import SimpleMarkerLayer from "../common/SimpleMarkerLayer";
+
+/**
+ * 定义管网问题图层提供类
+ * @alias PipenetErrorProvider
+ *
+ * @summary <用于加载问题管线、检查井图层>
+ */
+export default class PipenetErrorProvider {
+  /**
+   * 构造函数
+   * @param {Object} options -图层选项
+   */
+  constructor(options) {
+    /**
+     * 地图对象
+     * @type {Object}
+     */
+    this._map = options.map;
+
+    /**
+     * 最小缩放层级
+     * @type {Number}
+     */
+    this._minzoom = DataUtils.default(options.minzoom, 10);
+
+    /**
+     * 图标
+     * @type {String}
+     */
+    this._icon = DataUtils.default(options.icon, 'well_isolated');
+
+    /**
+     * 线颜色
+     * @type {String}
+     */
+    this._lineColor = DataUtils.default(options.color, '#37A2DA');
+
+    /**
+     * 线宽
+     * @type {Number}
+     */
+    this._lineWidth = DataUtils.default(options.width, 4.0);
+
+    /**
+     * 过滤条件数组(默认大管接小管)
+     * @type {Array}
+     */
+    this._filter = DataUtils.default(options.filter, undefined);
+
+    /**
+     * 是否分级显示
+     * @type {Boolean}
+     */
+    this._showByLevel = DataUtils.default(options.showByLevel, true);
+
+    /**
+     * 默认管线数据源ID
+     * @type {String}
+     */
+    this._defaultPipelineSourceId = DataUtils.default(options.pipelineSourceId, 'pipe_pipeline');
+
+    /**
+     * 默认检查井数据源ID
+     * @type {String}
+     */
+    this._defaultManholeSourceId = DataUtils.default(options.manholeSourceId, 'pipe_manhole');
+
+    /** 数据源ID **/
+    // 管线
+    this._pipelineSourceId = this._showByLevel ? (this._defaultPipelineSourceId + '-lvl1') : this._defaultPipelineSourceId;
+    this._lvl2_pipelineSourceId = this._showByLevel ? (this._defaultPipelineSourceId + '-lvl2') : undefined;
+    this._lvl3_pipelineSourceId = this._showByLevel ? (this._defaultPipelineSourceId + '-lvl3') : undefined;
+    // 检查井
+    this._manholeSourceId = this._showByLevel ? (this._defaultManholeSourceId + '-lvl1') : this._defaultManholeSourceId;
+    this._lvl2_manholeSourceId = this._showByLevel ? (this._defaultManholeSourceId + '-lvl2') : undefined;
+    this._lvl3_manholeSourceId = this._showByLevel ? (this._defaultManholeSourceId + '-lvl3') : undefined;
+
+    /** 图层ID **/
+    // 管线
+    this._pipelineLayerId = this._showByLevel ? (this._defaultPipelineSourceId + '-lvl1-error') : this._defaultPipelineSourceId + '-error';
+    this._lvl2_pipelineLayerId = this._defaultPipelineSourceId + '-lvl2-error';
+    this._lvl3_pipelineLayerId = this._defaultPipelineSourceId + '-lvl3-error';
+    // 检查井
+    this._manholeLayerId = this._showByLevel ? (this._defaultManholeSourceId + '-lvl1-error') : this._defaultManholeSourceId + '-error';
+    this._lvl2_manholeLayerId = this._defaultManholeSourceId + '-lvl2-error';
+    this._lvl3_manholeLayerId = this._defaultManholeSourceId + '-lvl3-error';
+
+    /** 图层对象 **/
+    // 管线
+    this._pipelineLayer = null;
+    this._lvl2_pipelineLayer = null;
+    this._lvl3_pipelineLayer = null;
+    // 检查井
+    this._manholeLayer = null;
+    this._lvl2_manholeLayer = null;
+    this._lvl3_manholeLayer = null;
+
+    // 初始化图层
+    this._initLayers();
+  }
+
+  /** 公有方法 **/
+  /**
+   * 设置数据
+   * @param {Object|Array} data -GeoJSON要素集/要素数组
+   */
+  setData(data = null) {
+    // 加载图层
+    this.loadLayer();
+
+    if (data) {
+      let features = [];
+      if (VerifyUtils.isGeoJsonFC(data)) {
+        features = data.features;
+      } else if (VerifyUtils.isArray(data)) {
+        if (data.length > 0 && VerifyUtils.isGeoJsonFeature(data[0])) {
+          features = data;
+        }
+      }
+
+      // 过滤点数据
+      let pointFC = GeoJsonProvider.getEmptyFC();
+      pointFC.features = features.filter((feature) => {
+        return feature.geometry.type.toLowerCase === 'point';
+      });
+      // 过滤线数据
+      let lineStringFC = GeoJsonProvider.getEmptyFC();
+      lineStringFC.features = features.filter((feature) => {
+        return feature.geometry.type.toLowerCase === 'linestring';
+      });
+
+      this._pipelineLayer.setData(lineStringFC);
+      this._manholeLayer.setData(pointFC);
+    }
+  }
+
+  /**
+   * 设置筛选器
+   * @param {Array} filter -筛选器
+   */
+  setFilter(filter) {
+    if (!this.hasLayer()) return;
+
+    if (filter && VerifyUtils.isArray(filter)) {
+      // 设置筛选器
+      this._pipelineLayer.setFilter(filter);
+
+      if (this._showByLevel) {
+        this._lvl2_pipelineLayer.setFilter(filter);
+        this._lvl3_pipelineLayer.setFilter(filter);
+      }
+    }
+  }
+
+  /**
+   * 设置绘制属性
+   * @param {String} name -属性名称
+   * @param {String|Object} value -属性值
+   */
+  setPaintProperty(name, value) {
+    this._pipelineLayer.setPaintProperty(name, value);
+
+    if (this._showByLevel) {
+      this._lvl2_pipelineLayer.setPaintProperty(name, value);
+      this._lvl3_pipelineLayer.setPaintProperty(name, value);
+    }
+  }
+
+  /**
+   * 设置布局属性
+   * @param {String} name -属性名称
+   * @param {String|Object} value -属性值
+   */
+  setLayoutProperty(name, value) {
+    this._pipelineLayer.setLayoutProperty(name, value);
+
+    if (this._showByLevel) {
+      this._lvl2_pipelineLayer.setLayoutProperty(name, value);
+      this._lvl3_pipelineLayer.setLayoutProperty(name, value);
+    }
+  }
+
+  /**
+   * 加载图层
+   */
+  loadLayer() {
+    if (!this.hasLayer()) {
+      // 管线
+      this._pipelineLayer.loadLayer();
+      if (this._showByLevel) {
+        this._lvl2_pipelineLayer.loadLayer();
+        this._lvl3_pipelineLayer.loadLayer();
+      }
+
+      // 检查井
+      this._manholeLayer.loadLayer();
+      if (this._showByLevel) {
+        this._lvl2_manholeLayer.loadLayer();
+        this._lvl3_manholeLayer.loadLayer();
+      }
+    }
+  }
+
+  /**
+   * 显示/隐藏图层
+   * @param {String} type -类型(pipeline、manhole)
+   * @param {Boolean} isShow -是否显示图层
+   */
+  showLayer(type, isShow) {
+    switch (type) {
+      case 'pipeline': { // 管线
+        this._pipelineLayer.showLayer(isShow);
+        if (this._showByLevel) {
+          this._lvl2_pipelineLayer.showLayer(isShow);
+          this._lvl3_pipelineLayer.showLayer(isShow);
+        }
+        break;
+      }
+      case 'manhole': { // 检查井
+        this._manholeLayer.showLayer(isShow);
+        if (this._showByLevel) {
+          this._lvl2_manholeLayer.showLayer(isShow);
+          this._lvl3_manholeLayer.showLayer(isShow);
+        }
+      }
+      default:
+        break;
+    }
+  }
+
+  /**
+   * 判断图层是否已加载
+   *
+   * @returns {Boolean}
+   */
+  hasLayer() {
+    return (
+      this._pipelineLayer.hasLayer() &&
+      this._manholeLayer.hasLayer()
+    );
+  }
+
+  /**
+   * 移除图层
+   */
+  removeLayer() {
+    // 管线
+    this._pipelineLayer.removeLayer();
+    if (this._showByLevel) {
+      this._lvl2_pipelineLayer.removeLayer();
+      this._lvl3_pipelineLayer.removeLayer();
+    }
+
+    // 检查井
+    this._manholeLayer.removeLayer();
+    if (this._showByLevel) {
+      this._lvl2_manholeLayer.removeLayer();
+      this._lvl3_manholeLayer.removeLayer();
+    }
+  }
+
+  /** 私有方法 **/
+  /**
+   * 初始化图层
+   */
+  _initLayers() {
+    const map = this._map;
+    const minZoom = this._minzoom;
+
+    /** 管线 **/
+    // 一级管线
+    this._pipelineLayer = new SimpleLineLayer({
+      map: map,
+      minzoom: minZoom,
+      color: this._lineColor,
+      width: this._lineWidth,
+      filter: this._filter,
+      fixed: true,
+      sourceId: this._pipelineSourceId,
+      layerId: this._pipelineLayerId
+    });
+
+    if (this._showByLevel) {
+      // 二级管线
+      this._lvl2_pipelineLayer = new SimpleLineLayer({
+        map: map,
+        minzoom: minZoom,
+        color: this._lineColor,
+        width: this._lineWidth,
+        filter: this._filter,
+        fixed: true,
+        sourceId: this._lvl2_pipelineSourceId,
+        layerId: this._lvl2_pipelineLayerId
+      });
+
+      // 三级管线
+      this._lvl3_pipelineLayer = new SimpleLineLayer({
+        map: map,
+        minzoom: minZoom,
+        color: this._lineColor,
+        width: this._lineWidth,
+        filter: this._filter,
+        fixed: true,
+        sourceId: this._lvl3_pipelineSourceId,
+        layerId: this._lvl3_pipelineLayerId
+      });
+    }
+    /** **/
+
+    /** 检查井 **/
+    // 一级检查井
+    this._manholeLayer = new SimpleMarkerLayer({
+      map: map,
+      minzoom: minZoom,
+      icon: this._icon,
+      size: 0.75,
+      filter: ['==', 'isolated_s', '1'],
+      sourceId: this._manholeSourceId,
+      layerId: this._manholeLayerId
+    });
+
+    if (this._showByLevel) {
+      // 二级检查井
+      this._lvl2_manholeLayer = new SimpleMarkerLayer({
+        map: map,
+        minzoom: minZoom,
+        icon: this._icon,
+        size: 0.75,
+        filter: ['==', 'isolated_s', '1'],
+        sourceId: this._lvl2_manholeSourceId,
+        layerId: this._lvl2_manholeLayerId
+      });
+
+      // 三级检查井
+      this._lvl3_manholeLayer = new SimpleMarkerLayer({
+        map: map,
+        minzoom: minZoom,
+        icon: this._icon,
+        size: 0.75,
+        filter: ['==', 'isolated_s', '1'],
+        sourceId: this._lvl3_manholeSourceId,
+        layerId: this._lvl3_manholeLayerId
+      });
+    }
+    /** **/
+  }
+}

package/mapboxgl/js/pipeline/PipenetFaultProvider.js

@@ -0,0 +1,219 @@
+import DataUtils from '../utils/DataUtils';
+import VerifyUtils from "../utils/VerifyUtils";
+import GeoJsonProvider from "../geog/GeoJsonProvider";
+import SimpleMarkerLayer from '../common/SimpleMarkerLayer';
+import SimpleLineLayer from '../common/SimpleLineLayer';
+
+/**
+ * 定义管网问题图层提供类
+ *
+ * @alias PipenetFaultProvider
+ *
+ * @summary <用于加载管线、检查井问题图层>
+ */
+export default class PipenetFaultProvider {
+  /**
+   * 构造函数
+   * @param {Object} options -图层选项
+   */
+  constructor(options) {
+    /**
+     * 地图对象
+     * @type {Object}
+     */
+    this._map = options.map;
+
+    /**
+     * 最小缩放层级
+     * @type {Number}
+     */
+    this._minzoom = DataUtils.default(options.minzoom, 10);
+
+    /**
+     * 图标
+     * @type {String}
+     */
+    this._icon = DataUtils.default(options.icon, 'well_isolated');
+
+    /**
+     * 线颜色
+     * @type {String}
+     */
+    this._lineColor = DataUtils.default(options.color, '#37A2DA');
+
+    /**
+     * 线宽
+     * @type {Number}
+     */
+    this._lineWidth = DataUtils.default(options.width, 4.0);
+
+    /**
+     * 过滤条件数组(默认大管接小管)
+     * @type {Array}
+     */
+    this._filter = DataUtils.default(options.filter, undefined);
+
+    // 管线问题数据源ID
+    this._pipelineSourceId = 'pipe_pipeline_fault';
+    // 检查井问题数据源ID
+    this._manholeSourceId = 'pipe_manhole_fault';
+
+    /** 图层对象 **/
+    this._pipelineLayer = null;
+    this._manholeLayer = null;
+
+    // 初始化图层
+    this._initLayers();
+  }
+
+  /** 公有方法 **/
+  /**
+   * 设置数据
+   * @param {Object|Array} data -GeoJSON要素集/要素数组
+   */
+  setData(data = null) {
+    // 加载图层
+    this.loadLayer();
+
+    if (data) {
+      let features = [];
+      if (VerifyUtils.isGeoJsonFC(data)) {
+        features = data.features;
+      } else if (VerifyUtils.isArray(data)) {
+        if (data.length > 0 && VerifyUtils.isGeoJsonFeature(data[0])) {
+          features = data;
+        }
+      }
+
+      // 过滤点数据
+      let pointFC = GeoJsonProvider.getEmptyFC();
+      pointFC.features = features.filter((feature) => {
+        return feature.geometry.type.toLowerCase === 'point';
+      });
+      // 过滤线数据
+      let lineStringFC = GeoJsonProvider.getEmptyFC();
+      lineStringFC.features = features.filter((feature) => {
+        return feature.geometry.type.toLowerCase === 'linestring';
+      });
+
+      this._pipelineLayer.setData(lineStringFC);
+      this._manholeLayer.setData(pointFC);
+    }
+  }
+
+  /**
+   * 设置筛选器
+   * @param {Array} filter -筛选器
+   */
+  setFilter(filter) {
+    if (!this.hasLayer()) return;
+
+    if (filter && VerifyUtils.isArray(filter)) {
+      // 设置筛选器
+      this._pipelineLayer.setFilter(filter);
+    }
+  }
+
+  /**
+   * 设置绘制属性
+   * @param {String} name -属性名称
+   * @param {String|Object} value -属性值
+   */
+  setPaintProperty(name, value) {
+    this._pipelineLayer.setPaintProperty(name, value);
+  }
+
+  /**
+   * 设置布局属性
+   * @param {String} name -属性名称
+   * @param {String|Object} value -属性值
+   */
+  setLayoutProperty(name, value) {
+    this._pipelineLayer.setLayoutProperty(name, value);
+  }
+
+  /**
+   * 加载图层
+   */
+  loadLayer() {
+    if (!this.hasLayer()) {
+      // 管线
+      this._pipelineLayer.loadLayer();
+
+      // 检查井
+      this._manholeLayer.loadLayer();
+    }
+  }
+
+  /**
+   * 显示/隐藏图层
+   * @param {String} type -类型(pipeline、manhole)
+   * @param {Boolean} isShow -是否显示图层
+   */
+  showLayer(type, isShow) {
+    switch (type) {
+      case 'pipeline': { // 管线
+        this._pipelineLayer.showLayer(isShow);
+        break;
+      }
+      case 'manhole': { // 检查井
+        this._manholeLayer.showLayer(isShow);
+      }
+      default:
+        break;
+    }
+  }
+
+  /**
+   * 判断图层是否已加载
+   *
+   * @returns {Boolean}
+   */
+  hasLayer() {
+    return (
+      this._pipelineLayer.hasLayer() &&
+      this._manholeLayer.hasLayer()
+    );
+  }
+
+  /**
+   * 移除图层
+   */
+  removeLayer() {
+    // 管线
+    this._pipelineLayer.removeLayer();
+
+    // 检查井
+    this._manholeLayer.removeLayer();
+  }
+
+  /** 私有方法 **/
+  /**
+   * 初始化图层列表
+   */
+  _initLayers() {
+    const map = this._map;
+    const minZoom = this._minzoom;
+
+    // 管线
+    this._pipelineLayer = new SimpleLineLayer({
+      map: map,
+      minzoom: minZoom,
+      color: this._lineColor,
+      width: this._lineWidth,
+      filter: this._filter,
+      fixed: true,
+      sourceId: this._pipelineSourceId,
+    });
+
+    // 检查井
+    this._manholeLayer = new SimpleMarkerLayer({
+      map: map,
+      minzoom: minZoom,
+      icon: this._icon,
+      size: 0.75,
+      filter: ['==', 'error_type', 'isolated'],
+      sourceId: this._manholeSourceId
+    });
+  }
+}