csk-gis-frame-work 4.0.0

package/mapboxgl/js/dynamic/BuildingsiteLayer.js

@@ -0,0 +1,179 @@
+import DataUtils from '../utils/DataUtils';
+import VerifyUtils from "../utils/VerifyUtils";
+import GeoJsonProvider from '../geog/GeoJsonProvider';
+import AnnotationLayer from '../common/AnnotationLayer';
+import SimpleMarkerLayer from '../common/SimpleMarkerLayer';
+import LayerProvider from '../geog/LayerProvider';
+
+/**
+ * 定义工地图层
+ *
+ * @alias BuildingsiteLayer
+ *
+ * @summary <用于加载工地点位图层>
+ */
+export default class BuildingsiteLayer {
+  /**
+   * 构造函数
+   * @param {Object} options -图层选项
+   */
+  constructor(options) {
+    /**
+     * 地图对象
+     * @type {Object}
+     */
+    this._map = options.map;
+
+    /**
+     * 最小缩放层级
+     * @type {Number}
+     */
+    this._minzoom = DataUtils.default(options.minzoom, 10);
+
+    /**
+     * 图标ID
+     * @type {String}
+     */
+    this._icon = DataUtils.default(options.icon, 'busi_site');
+
+    /**
+     * 数据源ID
+     * @type {String}
+     */
+    this._sourceId = DataUtils.default(options.sourceId, 'pipe_facility_site');
+
+    /**
+     * 图层ID
+     * @type {String}
+     */
+    this._layerId = DataUtils.default(options.layerId, this._sourceId);
+    this._lableLayerId = this.layerId + '-label';
+
+    // 图层
+    this._markerLayer = null;
+    this._lableLayer = null;
+    // 初始化图层
+    this._initLayers();
+  }
+
+  /** 公有方法 **/
+  /**
+   * 设置数据
+   * @param {Object|Array} data -GeoJson要素/要素集/点位数组
+   */
+  setData(data = null) {
+    let fc = null;
+    if (VerifyUtils.isGeoJsonFC(data)) {
+      fc = data;
+    } else if (VerifyUtils.isGeoJsonFeature(data)) {
+      fc = GeoJsonProvider.getEmptyFC();
+      fc.features = [data];
+    } else if (VerifyUtils.isArray(data)) {
+      fc = GeoJsonProvider.data2PointFC(data);
+    }
+
+    this._fc = fc || GeoJsonProvider.getEmptyFC();
+    // 设置数据
+    this._markerLayer.setData(this._fc);
+    this._lableLayer.setData(this._fc);
+  }
+
+  /**
+   * 设置过滤器
+   * @param {Array} filter -过滤器
+   */
+  setFilter(filter) {
+    this._markerLayer.setFilter(filter);
+    this._lableLayer.setFilter(filter);
+  }
+
+  /**
+   * 加载图层
+   */
+  loadLayer() {
+    // 加载图层
+    if (!this.hasLayer()) {
+      this._markerLayer.loadLayer();
+    }
+
+    this.showLayer(true);
+  }
+
+  /**
+   * 显示/隐藏图层
+   * @param {Boolean} isShow -是否显示
+   */
+  showLayer(isShow) {
+    this._markerLayer.showLayer(isShow);
+    this._lableLayer.showLayer(isShow);
+  }
+
+  /**
+   * 判断图层是否已加载
+   *
+   * @returns {Boolean}
+   */
+  hasLayer() {
+    return (
+      this._markerLayer.hasLayer() &&
+      this._lableLayer.hasLayer()
+    );
+  }
+
+  /**
+   * 移除图层
+   */
+  removeLayer() {
+    this._lableLayer.removeLayer();
+    this._markerLayer.removeLayer();
+
+    // 移除数据源
+    this._markerLayer.removeSource();
+  }
+
+  /**
+   * 绑定单击事件
+   * @param {Function} event -事件函数
+   */
+  onClick(event) {
+    this._markerLayer.onClick(event);
+  }
+
+  /**
+   * 绑定事件
+   * @param {String} name -事件名称
+   * @param {Function} event -事件函数
+   */
+  onEvent(name, event) {
+    this._markerLayer.onEvent(name, event);
+  }
+
+  /** 私有方法 **/
+  /**
+   * 初始化图层
+   */
+  _initLayers() {
+    const map = this._map;
+    const minZoom = this._minzoom;
+
+    // 点图层
+    this._markerLayer = new SimpleMarkerLayer({
+      map: map,
+      minzoom: minZoom,
+      icon: this._icon,
+      sourceId: this._sourceId,
+      layerId: this._layerId
+    });
+
+    // 标注图层
+    this._lableLayer = new AnnotationLayer({
+      map: map,
+      minzoom: minZoom + 2.75,
+      field: 'name',
+      textSize: 13,
+      textOffset: [0, -1.75],
+      sourceId: this._sourceId,
+      layerId: this._lableLayerId
+    });
+  }
+}

package/mapboxgl/js/dynamic/BusinessProvider.js

@@ -0,0 +1,547 @@
+import DataUtils from '../utils/DataUtils';
+import VerifyUtils from '../utils/VerifyUtils';
+import GeoJsonProvider from '../geog/GeoJsonProvider';
+import SimpleMarkerLayer from '../common/SimpleMarkerLayer';
+import TrackingLayer from '../common/TrackingLayer';
+import AlarmLayer from '../equipment/AlarmLayer';
+import StoreLayer from './StoreLayer';
+import EventLayer from './EventLayer';
+import StaffLayer from './StaffLayer';
+import VehicleLayer from './VehicleLayer';
+import WorkorderLayer from './WorkorderLayer';
+import BuildingsiteLayer from './BuildingsiteLayer';
+
+/**
+ * 定义业务图层提供类
+ *
+ * @alias BusinessProvider
+ *
+ * @summary <用于加载业务图层>
+ */
+export default class BusinessProvider {
+  /**
+   * 构造函数
+   * @param {Object} options -图层选项
+   */
+  constructor(options) {
+    /**
+     * 地图对象
+     * @type {Object}
+     */
+    this._map = options.map;
+
+    /**
+     * 地图组件
+     * @type {Object}
+     */
+    this._mapRef = options.mapRef;
+
+    /**
+     * 最小缩放层级
+     * @type {Number}
+     */
+    this._minzoom = DataUtils.default(options.minzoom, 10);
+
+    /** 图层对象 **/
+    this._alarmLayer = null; // 报警
+
+    this._eventLayer = null; // 事件
+    this._orderLayer = null; // 工单
+    this._siteLayer = null;  // 工地点
+    this._storeLayer = null; // 仓库
+
+    this._staffLayer = null;    // 人员
+    this._vehicleLayer = null;  // 车辆
+    this._trackingLayer = null; // 轨迹
+    this._patrolLayer = null; // 巡查点
+
+    // 初始化图层
+    this._initLayers();
+  }
+
+  /** 公有方法 **/
+  /**
+   * 设置数据
+   * @param {String} type -类型
+   * @param {Array|Object} data -数据
+   */
+  setData(type, data) {
+    switch (type) {
+      case 'faci-alarm': { // 报警
+        this._alarmLayer.setData(data);
+        break;
+      }
+      case 'buss-event': { // 事件
+        this._eventLayer.setData(data);
+        break;
+      }
+      case 'faci-order': { // 工单
+        this._orderLayer.setData(data);
+        break;
+      }
+      case 'buss-site': { // 工地
+        this._siteLayer.setData(data);
+        break;
+      }
+      case 'buss-store': { // 仓库
+        this._storeLayer.setData(data);
+        break;
+      }
+      case 'faci-staff': { // 人员
+        this._staffLayer.setData(data);
+        break;
+      }
+      case 'faci-vehicle': { // 车辆
+        this._vehicleLayer.setData(data);
+        break;
+      }
+      default:
+        break;
+    }
+  }
+
+  /**
+   * 设置筛选器
+   * @param {String} type -类型
+   * @param {Array} filter -过滤器
+   */
+  setFilter(type, filter) {
+    switch (type) {
+      case 'faci-alarm': { // 报警
+        this._alarmLayer.setFilter(filter);
+        break;
+      }
+      case 'buss-event': { // 事件
+        this._eventLayer.setFilter(filter);
+        break;
+      }
+      case 'faci-order': { // 工单
+        this._orderLayer.setFilter(filter);
+        break;
+      }
+      case 'buss-site': { // 工地
+        this._siteLayer.setFilter(filter);
+        break;
+      }
+      case 'buss-store': { // 仓库
+        this._storeLayer.setFilter(filter);
+        break;
+      }
+      case 'faci-staff': { // 人员
+        this._staffLayer.setFilter(filter);
+        break;
+      }
+      case 'faci-vehicle': { // 车辆
+        this._vehicleLayer.setFilter(filter);
+        break;
+      }
+      default:
+        break;
+    }
+  }
+
+  /**
+   * 移除所有图层
+   */
+  removeAllLayers() {
+    // 报警
+    if (this._alarmLayer) {
+      this._alarmLayer.removeLayer();
+      this._alarmLayer = null;
+    }
+
+    // 工单
+    if (this._orderLayer) {
+      this._orderLayer.removeLayer();
+      this._orderLayer = null;
+    }
+
+    // 事件
+    if (this._eventLayer) {
+      this._eventLayer.removeLayer();
+      this._eventLayer = null;
+    }
+
+    // 工地
+    if (this._siteLayer) {
+      this._siteLayer.removeLayer();
+      this._siteLayer = null;
+    }
+
+    // 仓库
+    if (this._storeLayer) {
+      this._storeLayer.removeLayer();
+      this._storeLayer = null;
+    }
+
+    // 人员
+    if (this._staffLayer) {
+      this._staffLayer.removeLayer();
+      this._staffLayer = null;
+    }
+    // 巡查点
+    if (this._patrolLayer) {
+      this._patrolLayer.removeLayer();
+      this._patrolLayer = null;
+    }
+
+    // 车辆
+    if (this._vehicleLayer) {
+      this._vehicleLayer.removeLayer();
+      this._vehicleLayer = null;
+    }
+    // 轨迹
+    if (this._trackingLayer) {
+      this._trackingLayer.removeLayer();
+      this._trackingLayer = null;
+    }
+  }
+
+  /**
+   * 选中数据
+   * @param {String} type -类型
+   * @param {Object} data -数据
+   */
+  selectData(type, data) {
+    switch (type) {
+      case 'faci-alarm': { // 报警
+        break;
+      }
+      case 'faci-order': { // 工单
+        break;
+      }
+      case 'buss-event': { // 事件
+        break;
+      }
+      case 'buss-site': { // 工地
+        break;
+      }
+      case 'buss-store': { // 仓库
+        break;
+      }
+      case 'faci-staff': { // 人员
+        this._staffLayer.selectData(data, 'executorId');
+        break;
+      }
+      case 'faci-vehicle': { // 车辆
+        this._vehicleLayer.selectData(data, 'vehicleId');
+        break;
+      }
+      default:
+        break;
+    }
+  }
+
+  /**
+   * 显示/隐藏业务图层
+   * @param {String} type -业务类型
+   * @param {Boolean} isShow -是否显示
+   */
+  showLayer(type, isShow = true) {
+    switch (type) {
+      case 'faci-alarm': { // 报警
+        this._alarmLayer.showLayer(isShow);
+        break;
+      }
+      case 'buss-event': { // 事件
+        this._eventLayer.showLayer(isShow);
+        break;
+      }
+      case 'faci-order': { // 工单
+        this._orderLayer.showLayer(isShow);
+        break;
+      }
+      case 'buss-site': { // 工地
+        this._siteLayer.showLayer(isShow);
+        break;
+      }
+      case 'buss-store': { // 仓库
+        this._storeLayer.showLayer(isShow);
+        break;
+      }
+      case 'faci-staff': { // 人员
+        this._staffLayer.showLayer(isShow);
+        break;
+      }
+      case 'faci-vehicle': { // 车辆
+        this._vehicleLayer.showLayer(isShow);
+        break;
+      }
+      default:
+        break;
+    }
+  }
+
+  /**
+   * 绑定单击事件
+   * @param {String} type -设施类型
+   * @param {Function} event -事件函数
+   */
+  bindClickEvent(type, event) {
+    switch (type) {
+      case 'faci-alarm': { // 报警
+        this._alarmLayer.onClick(event);
+        break;
+      }
+      case 'buss-event': { // 事件
+        this._eventLayer.onClick(event);
+        break;
+      }
+      case 'faci-order': { // 工单
+        this._orderLayer.onClick(event);
+        break;
+      }
+      case 'buss-site': { // 工地
+        this._siteLayer.onClick(event);
+        break;
+      }
+      case 'buss-store': { // 仓库
+        this._storeLayer.onClick(event);
+        break;
+      }
+      case 'faci-staff': { // 人员
+        this._staffLayer.onClick(event);
+        break;
+      }
+      case 'faci-vehicle': { // 车辆
+        this._vehicleLayer.onClick(event);
+        break;
+      }
+      default:
+        break;
+    }
+  }
+
+  /**
+   * 绑定事件
+   * @param {String} type -类型
+   * @param {String} name -事件名称
+   * @param {Function} event -事件函数
+   */
+  bindEvent(type, name, event) {
+    switch (type) {
+      case 'faci-alarm': { // 报警
+        this._alarmLayer.onEvent(name, event);
+        break;
+      }
+      case 'buss-event': { // 事件
+        this._eventLayer.onEvent(name, event);
+        break;
+      }
+      case 'faci-order': { // 工单
+        this._orderLayer.onEvent(name, event);
+        break;
+      }
+      case 'buss-site': { // 工地
+        this._siteLayer.onEvent(name, event);
+        break;
+      }
+      case 'buss-store': { // 仓库
+        this._storeLayer.onEvent(name, event);
+        break;
+      }
+      case 'faci-staff': { // 人员
+        this._staffLayer.onEvent(name, event);
+        break;
+      }
+      case 'faci-vehicle': { // 车辆
+        this._vehicleLayer.onEvent(name, event);
+        break;
+      }
+      default:
+        break;
+    }
+  }
+
+  /**
+   * 车辆历史轨迹
+   * @param {Array} data -轨迹点数组
+   */
+  vehicleTrail(data) {
+    //console.log('Vehicle trail data:', data);
+    if (!this._trackingLayer) {
+      this._trackingLayer = new TrackingLayer({
+        map: this._map,
+        mapRef: this._mapRef,
+        minzoom: this._minzoom,
+        //tooltip: {'时间': 'gpsTime'}
+        tooltip: {'时间': 'receivetime'}
+      });
+    }
+    // 设置帧率
+    this._trackingLayer.setFrameRate(20);
+
+    // 设置轨迹数据
+    this._trackingLayer.setData(data);
+  }
+
+  /**
+   * 人员历史轨迹
+   * @param {Array} data -轨迹点数组
+   * @param {Array} patrolData -巡查点数组
+   * @param {Boolean} jump -是否调至地图(无动画)
+   */
+  staffTrail(data, patrolData, jump = false) {
+    //console.log('Staff trail data:', data);
+    if (!this._trackingLayer) {
+      this._trackingLayer = new TrackingLayer({
+        map: this._map,
+        mapRef: this._mapRef,
+        minzoom: this._minzoom,
+        tooltip: {'时间': 'createDate'}
+      });
+    } else {
+      // 移除图层
+      this._trackingLayer.removeLayer();
+    }
+    // 设置帧率
+    this._trackingLayer.setFrameRate(5);
+
+    // 获取巡查点要素集
+    const patrolFC = GeoJsonProvider.getEmptyFC();
+    if (patrolData && patrolData.length > 1) {
+      patrolFC.features = patrolData.map((item) => {
+        let status = ((item.report && item.report > 0) ||
+                      (item.record && item.record > 0)) ? '2' : null;
+
+        let geometry = null;
+        if (item.geom) {
+          geometry = VerifyUtils.isString(item.geom) ? JSON.parse(item.geom) : item.geom;
+        } else {
+          geometry = {
+            type: 'Point',
+            coordinates: [item.lng || item.longitude, item.lat || item.latitude]
+          }
+        }
+
+        const properties = {
+          id: item.id,
+          category: item.category,
+          faci_id: item.featureCode,
+          status: status ? status : (item.patrolTime ? '1' : '0')
+        };
+
+        return GeoJsonProvider.getFeature(geometry, properties);
+      });
+    }
+
+    // 设置轨迹数据
+    this._trackingLayer.setData(data, patrolFC, jump);
+  }
+
+  /**
+   * 轨迹播放
+   */
+  trailPlay() {
+    if (this._trackingLayer) {
+      this._trackingLayer.play();
+    }
+  }
+
+  /**
+   * 倍速播放
+   * @param {Number} multiple -倍数
+   */
+  trailPlayMultiply(multiple) {
+    if (this._trackingLayer) {
+      this._trackingLayer.playMultiply(multiple);
+    }
+  }
+
+  /**
+   * 轨迹暂停
+   */
+  trailPause() {
+    if (this._trackingLayer) {
+      this._trackingLayer.pause();
+    }
+  }
+  /**
+   * 轨迹停止
+   */
+  trailStop() {
+    if (this._trackingLayer) {
+      this._trackingLayer.stop();
+    }
+  }
+
+  /**
+   * 移除轨迹
+   */
+  removeTrail() {
+    if (this._trackingLayer) {
+      this._trackingLayer.removeLayer();
+    }
+  }
+
+  /** 私有方法 **/
+  /**
+   * 初始化图层
+   */
+  _initLayers() {
+    const map = this._map;
+    const minZoom = this._minzoom;
+
+    // 报警
+    this._alarmLayer = new AlarmLayer({
+      map: map,
+      minzoom: minZoom
+    });
+
+    // 事件
+    this._eventLayer = new EventLayer({
+      map: map,
+      minzoom: minZoom
+    });
+
+    // 工单
+    this._orderLayer = new WorkorderLayer({
+      map: map,
+      minzoom: minZoom
+    });
+
+    // 工地
+    this._siteLayer = new BuildingsiteLayer({
+      map: map,
+      minzoom: minZoom
+    });
+
+    // 仓库
+    this._storeLayer = new StoreLayer({
+      map: map,
+      minzoom: minZoom
+    });
+
+    // 人员
+    this._staffLayer = new StaffLayer({
+      map: map,
+      minzoom: minZoom
+    });
+
+    // 车辆
+    this._vehicleLayer = new VehicleLayer({
+      map: map,
+      minzoom: minZoom
+    });
+  }
+
+  /**
+   * 获取轨迹数据
+   * @param {Array} data -点位数组
+   *
+   * @return {Object} GeoJSON要素集
+   */
+  _getTrailData(data) {
+    const fc = GeoJsonProvider.getEmptyFC();
+    if (data && data.length > 1) {
+      // 轨迹点数组转折线
+      const coordinates = data.map((point) => {
+        return [point.lng, point.lat];
+      });
+
+      fc.features = [GeoJsonProvider.getLineStringFeature(coordinates)];
+    }
+
+    return fc;
+  }
+}