@gis_victory/gismap 1.0.0 → 1.0.2

package/src/manager/LayerManager.ts

@@ -1,119 +0,0 @@
-export default class LayerManager {
-  private map: mapboxgl.Map;
-  private checkedParentLayers: Map<string, any> = new Map();
-  private checkedLayers: Map<string, any> = new Map();
-  public queryLayerIds: string[] = [];
-  private symbolLayerIds: string[] = [];
-  private pointLayerIds: string[] = [];
-  private lineLayerIds: string[] = [];
-  private polygonLayerIds: string[] = [];
-  constructor(map: mapboxgl.Map) {
-    this.map = map;
-  }
-
-  private addSource(sourceConfig: any) {
-    if (!this.map.getSource(sourceConfig.id)) {
-      const source = Object.assign(
-        {
-          type: "geojson",
-          tiles: [sourceConfig.url],
-        },
-        sourceConfig
-      );
-      this.map.addSource(sourceConfig.id, source);
-    }
-    return this;
-  }
-
-  addLayer(layerConfig: any) {
-    this.addSource(layerConfig.source);
-    const layer = Object.assign(
-      {
-        id: layerConfig.id,
-        source: layerConfig.id,
-      },
-      layerConfig.layer
-    );
-    this.map.addLayer(layer);
-    this.checkedLayers.set(layer.id, {
-      layer,
-      extension: layerConfig?.extension,
-    });
-    if (layerConfig.isQuery) {
-      this.queryLayerIds.push(layer.id);
-    }
-    switch (layer.type) {
-      case "symbol":
-        this.symbolLayerIds.push(layer.id);
-        break;
-      case "point":
-        this.pointLayerIds.push(layer.id);
-        break;
-      case "line":
-        this.lineLayerIds.push(layer.id);
-        break;
-      case "fill":
-      case "fill-extrusion":
-        this.polygonLayerIds.push(layer.id);
-        break;
-      default:
-        break;
-    }
-    return this;
-  }
-
-  addGroupLayer(layer: any) {
-    const { id, layers } = layer;
-    if (layers) {
-      layers.forEach((_layer: any) => {
-        _layer.layer = Object.assign(
-          {
-            id: id,
-            source: id,
-          },
-          _layer.layer
-        );
-        _layer.source = Object.assign(
-          {
-            id: id,
-          },
-          _layer.source
-        );
-        this.addLayer(_layer);
-      });
-      this.checkedParentLayers.set(id, layer);
-    }
-  }
-
-  removeLayer(layer: any) {
-    if (this.map.getLayer(layer.layer.id)) {
-      this.map.removeLayer(layer.layer.id);
-    }
-    // if (this.map.getSource(layer.source.id)) {
-    //   this.map.removeSource(layer.source.id);
-    // }
-    this.checkedLayers.delete(layer.id);
-
-    if (layer.isQuery) {
-      this.queryLayerIds = this.queryLayerIds.filter(
-        (item) => item !== layer.layer.id
-      );
-    }
-  }
-
-  removeGroupLayer(layer: any) {
-    const { id, layers } = layer;
-    if (layers) {
-      layers.forEach((_layer: any) => {
-        _layer.layer = Object.assign({ id: id }, _layer.layer);
-        _layer.source = Object.assign({ id: id }, _layer.source);
-        this.removeLayer(_layer);
-      });
-    }
-    this.checkedParentLayers.delete(id);
-  }
-
-  getLayer(id: string) {
-    return id ? this.checkedLayers.get(id) : null;
-  }
-}

package/src/manager/MarkerManager.ts

@@ -1,65 +0,0 @@
-import mapboxgl from "@gis_victory/mapbox-gl";
-import type GSMap from "../types/GSMap";
-
-export default class MarkerManager {
-  private map: GSMap;
-  private marker?: mapboxgl.Marker;
-  constructor(map: GSMap) {
-    this.map = map;
-  }
-
-  show({
-    position,
-    html,
-    markerIcon = "marker",
-    offset = [0, -30],
-    iconName,
-    flyTo = false,
-  }: {
-    position: any;
-    html?: string;
-    markerIcon?: string;
-    offset?: number[];
-    iconName?: string;
-    flyTo?: boolean;
-  }) {
-    if (this.marker) {
-      this.marker.remove();
-    }
-    debugger;
-    const markerContainer = document.createElement("div");
-    markerContainer.className = "marker-container";
-    const markerIconElement = document.createElement("div");
-    markerIconElement.className = `${markerIcon}`;
-    if (iconName) {
-      markerIconElement.innerHTML = `<img src='${iconName}' class="marker-icon" />`;
-    }
-    markerContainer.appendChild(markerIconElement);
-    this.marker = new mapboxgl.Marker({
-      element: markerContainer,
-      anchor: "bottom",
-    })
-      .setLngLat(position)
-      .addTo(this.map);
-    if (html) {
-      this.marker.setPopup(
-        new mapboxgl.Popup({
-          closeOnClick: false,
-          closeOnMove: false,
-          className: "map-popup",
-          anchor: "bottom",
-          offset: offset as [number, number],
-        }).setHTML(html)
-      ).togglePopup();
-    }
-    if (flyTo) {
-      this.map.flyTo({
-        center: position,
-      });
-    }
-  }
-
-  close() {
-    this.marker?.remove();
-  }
-}

package/src/manager/MaskManager.ts

@@ -1,37 +0,0 @@
-import type GSMap from "../types/GSMap";
-
-export default class MaskManager {
-  private map: GSMap;
-  private layerId: string = "mask_layer";
-  constructor(map: GSMap) {
-    this.map = map;
-  }
-  add(url: string, style: any = {}, beforeId?: string) {
-    if (!this.map.getSource(this.layerId)) {
-      this.map.addSource(this.layerId, {
-        type: "geojson",
-        data: url,
-      });
-    }
-    const option = Object.assign(
-      {
-        id: this.layerId,
-        source: this.layerId,
-        type: "fill",
-        paint: {
-          "fill-color": "#000000",
-          "fill-opacity": 0.5,
-        },
-      },
-      style
-    );
-    if (!this.map.getLayer(this.layerId)) {
-      this.map.addLayer(option, beforeId);
-    }
-  }
-
-  remove() {
-    this.map.removeLayer(this.layerId);
-    this.map.removeSource(this.layerId);
-  }
-}

package/src/manager/PopupManager.ts

@@ -1,46 +0,0 @@
-import mapboxgl from "@gis_victory/mapbox-gl";
-import type GSMap from "../types/GSMap";
-
-export default class PopupManager {
-  private map: GSMap;
-  private popup: mapboxgl.Popup;
-  constructor(map: GSMap) {
-    this.map = map;
-    this.popup = new mapboxgl.Popup({
-      closeOnClick: false,
-      closeOnMove: false,
-      className: "map-popup",
-      anchor: "bottom",
-    });
-  }
-
-  show({
-    position,
-    html,
-    offset = [0, -10],
-    flyTo = false,
-  }: {
-    position: any;
-    html: string;
-    offset: any;
-    flyTo: boolean;
-  }) {
-    if (html) {
-      this.popup.setHTML(html);
-    }
-    if (offset) {
-      this.popup.setOffset(offset);
-    }
-    this.popup.setLngLat(position);
-    this.popup.addTo(this.map);
-    if (flyTo) {
-      this.map.flyTo({
-        center: position,
-      });
-    }
-  }
-
-  close() {
-    this.popup.remove();
-  }
-}

package/src/manager/RadarManager.ts

@@ -1,156 +0,0 @@
-import { GeoJSONSource } from "@gis_victory/mapbox-gl";
-import GSMap from "../types/GSMap";
-import * as turf from "@turf/turf";
-
-export default class RadarManager {
-  private map?: GSMap;
-  private id: string = `radar-${Math.random()}`;
-  private radius: number = 100; // 半径（米）
-  private period: number = 3000; // 扫描一圈时间（毫秒）
-  private backgroundColor: string = "rgba(255,0,0,0.1)"; // 背景颜色
-  private borderColor: string = "rgba(255,0,0,0.8)"; // 边框颜色
-  private borderWidth: number = 2; // 边框宽度
-  private sectorAngle: number = 30; // 扫描扇形角度（度）
-  private sectorColor: string = "rgba(0,255,0,0.4)"; // 扇形颜色
-  private sectorBorderColor: string = "rgba(0,0,255,0.8)"; // 扇形边框颜色
-  private center: [number, number] = [0, 0];
-  private animationId: number | null = null; // 添加动画ID属性
-  constructor(map?: GSMap) {
-    this.map = map;
-  }
-
-  add(options: any) {
-    this.center = options.center;
-    if (options.radius) {
-      this.radius = options.radius;
-    }
-    if (options.period) {
-      this.period = options.period;
-    }
-    if (options.backgroundColor) {
-      this.backgroundColor = options.backgroundColor;
-    }
-    if (options.borderColor) {
-      this.borderColor = options.borderColor;
-    }
-    if (options.borderWidth) {
-      this.borderWidth = options.borderWidth;
-    }
-    if (options.sectorAngle) {
-      this.sectorAngle = options.sectorAngle;
-    }
-    if (options.sectorColor) {
-      this.sectorColor = options.sectorColor;
-    }
-    if (options.sectorBorderColor) {
-      this.sectorBorderColor = options.sectorBorderColor;
-    }
-    // 圆背景数据
-    const circle = turf.circle(this.center, this.radius, {
-      steps: 64,
-      units: "meters",
-    });
-    // 初始扇形
-    const sector = turf.sector(this.center, this.radius, 0, this.sectorAngle, {
-      steps: 64,
-      units: "meters",
-    });
-    //添加圆背景图层
-    this.map?.addSource(this.id + "-circle", {
-      type: "geojson",
-      data: circle,
-    });
-    //添加扇形图层
-    this.map?.addSource(this.id + "-sector", {
-      type: "geojson",
-      data: sector,
-    });
-
-    //增加页面
-    this.map?.addLayer({
-      id: this.id + "-circle-fill",
-      type: "fill",
-      source: this.id + "-circle",
-      paint: {
-        "fill-color": this.backgroundColor,
-        "fill-outline-color": this.borderColor,
-      },
-    });
-
-    // 圆环边框
-    this.map?.addLayer({
-      id: this.id + "-circle-outline",
-      type: "line",
-      source: this.id + "-circle",
-      paint: {
-        "line-color": this.borderColor,
-        "line-width": this.borderWidth,
-      },
-    });
-
-    // 扇形
-    this.map?.addLayer({
-      id: this.id + "-sector-fill",
-      type: "fill",
-      source: this.id + "-sector",
-      paint: {
-        "fill-color": this.sectorColor,
-        "fill-outline-color": this.sectorBorderColor,
-      },
-    });
-    return this;
-  }
-
-  // 扫描
-  startScan() {
-    this.stopScan();
-    // 动画
-    let startTime = performance.now();
-    const animate = (time: number) => {
-      let elapsed = time - startTime;
-      let angle = ((elapsed % this.period) / this.period) * 360;
-      const newSector = turf.sector(this.center, this.radius, angle, angle + this.sectorAngle, {
-        steps: 64,
-        units: "meters",
-      });
-      if (this.map?.getSource(this.id + "-sector")) {
-        (this.map?.getSource(this.id + "-sector") as GeoJSONSource)?.setData(
-          newSector
-        );
-      }
-      this.animationId = requestAnimationFrame(animate);
-    };
-    this.animationId = requestAnimationFrame(animate);
-    return this;
-  }
-
-  stopScan() {
-    // 确保先停止之前可能存在的动画
-    if (this.animationId) {
-      cancelAnimationFrame(this.animationId);
-      this.animationId = null;
-    }
-    return this;
-  }
-
-  remove() {
-    this.stopScan();
-    // 移除图层
-    if (this.map?.getLayer(this.id + "-circle-fill")) {
-      this.map?.removeLayer(this.id + "-circle-fill");
-    }
-    if (this.map?.getLayer(this.id + "-circle-outline")) {
-      this.map?.removeLayer(this.id + "-circle-outline");
-    }
-    if (this.map?.getLayer(this.id + "-sector-fill")) {
-      this.map?.removeLayer(this.id + "-sector-fill");
-    }
-    // 移除数据源
-    if (this.map?.getSource(this.id + "-circle")) {
-      this.map?.removeSource(this.id + "-circle");
-    }
-    if (this.map?.getSource(this.id + "-sector")) {
-      this.map?.removeSource(this.id + "-sector");
-    }
-  }
-}

package/src/manager/TDTManager.ts

@@ -1,149 +0,0 @@
-import type GSMap from "../types/GSMap";
-
-export default class TDTManager {
-  private map: GSMap;
-  private tdtImgId: string = "tdt-img";
-  private tdtVecId: string = "tdt-vec";
-  private tdtCiaId: string = "tdt-cia";
-  private tdtLayer: Map<string, any> = new Map();
-  private token: string = "6c8a0fffe8f584f8310306723f5bc776";
-  constructor(map: GSMap, token?: string) {
-    this.map = map;
-    this.token = token || this.token;
-    this.tdtLayer.set(this.tdtImgId, {
-      type: "raster",
-      tiles: [
-        `https://t0.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t1.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t2.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t3.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t4.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t5.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t6.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t7.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-      ],
-      tileSize: 256,
-      maxzoom: 17,
-      crs: "EPSG:4326",
-    });
-    this.tdtLayer.set(this.tdtCiaId, {
-      type: "raster",
-      tiles: [
-        `https://t0.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t1.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t2.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t3.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t4.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t5.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t6.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `https://t7.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-      ],
-      tileSize: 256,
-      maxzoom: 17,
-      crs: "EPSG:4326",
-    });
-    this.tdtLayer.set(this.tdtVecId, {
-      type: "raster",
-      tiles: [
-        `http://t0.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `http://t1.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `http://t2.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `http://t3.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `http://t4.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `http://t5.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `http://t6.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-        `http://t7.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=${this.token}`,
-      ],
-      tileSize: 256,
-      maxzoom: 18,
-      crs: "EPSG:4326",
-    });
-  }
-
-  addImgLayer(beforeId?: string) {
-    let source: any = this.map.getSource(this.tdtImgId);
-    if (!source) {
-      source = this.tdtLayer.get(this.tdtImgId);
-      this.map.addSource(this.tdtImgId, source);
-    }
-    if (beforeId && this.map.getLayer(beforeId)) {
-      this.map.addLayer({
-        id: this.tdtImgId,
-        type: "raster",
-        source: this.tdtImgId,
-      }, beforeId);
-    } else {
-      this.map.addLayer({
-        id: this.tdtImgId,
-        type: "raster",
-        source: this.tdtImgId,
-      });
-    }
-  }
-
-  removeImgLayer() {
-    if (this.map.getLayer(this.tdtImgId)) {
-      this.map.removeLayer(this.tdtImgId);
-    }
-  }
-
-  addVecLayer(beforeId?: string) {
-    let source: any = this.map.getSource(this.tdtVecId);
-    if (!source) {
-      source = this.tdtLayer.get(this.tdtVecId);
-      this.map.addSource(this.tdtVecId, source);
-    }
-    if (beforeId && this.map.getLayer(beforeId)) {
-      this.map.addLayer({
-        id: this.tdtVecId,
-        type: "raster",
-        source: this.tdtVecId
-      }, beforeId);
-    } else {
-      this.map.addLayer({
-        id: this.tdtVecId,
-        type: "raster",
-        source: this.tdtVecId
-      });
-    }
-  }
-
-  removeVecLayer() {
-    if (this.map.getLayer(this.tdtVecId)) {
-      this.map.removeLayer(this.tdtVecId);
-    }
-  }
-
-  addCiaLayer(beforeId?: string) {
-    let source: any = this.map.getSource(this.tdtCiaId);
-    if (!source) {
-      source = this.tdtLayer.get(this.tdtCiaId);
-      this.map.addSource(this.tdtCiaId, source);
-    }
-    if (beforeId && this.map.getLayer(beforeId)) {
-      this.map.addLayer({
-        id: this.tdtCiaId,
-        type: "raster",
-        source: this.tdtCiaId
-      }, beforeId);
-    } else {
-      this.map.addLayer({
-        id: this.tdtCiaId,
-        type: "raster",
-        source: this.tdtCiaId
-      });
-    }
-  }
-
-  removeCiaLayer() {
-    if (this.map.getLayer(this.tdtCiaId)) {
-      this.map.removeLayer(this.tdtCiaId);
-    }
-  }
-
-  clear() {
-    this.removeImgLayer();
-    this.removeVecLayer();
-    this.removeCiaLayer();
-  }
-}

package/src/manager/TemplateManager.ts

@@ -1,13 +0,0 @@
-export default class TemplateManager {
-  private templates: Map<string, string> = new Map();
-  constructor() {}
-  add(id: string, template: string) {
-    this.templates.set(id, template);
-  }
-  remove(id: string) {
-    this.templates.delete(id);
-  }
-  get(id: string) {
-    return this.templates.get(id);
-  }
-}

package/src/manager/TerrainManager.ts

@@ -1,61 +0,0 @@
-import GSMap from "../types/GSMap";
-
-export default class TerrainManager {
-  private map: GSMap;
-  constructor(map: GSMap) {
-    this.map = map;
-  }
-
-  addSource() {
-    // map.addSource("raster-dem", {
-    //   type: "raster-dem",
-    //   tiles: [
-    //     "http://121.228.31.116:8066/geoserver/gwc/service/tms/1.0.0/cite%3Asx_dem30@EPSG%3A900913@png/{z}/{x}/{y}.png",
-    //   ],
-    //   scheme: "tms",
-    //   minzoom: 6,
-    //   maxzoom: 18,
-    //   tileSize: 256,
-    // });
-    // map.setTerrain({
-    //   source: "raster-dem",
-    //   exaggeration: 1, // 地形拉升强度（1.0为原始高度）
-    // });
-    this.map.addSource("raster-dem", {
-      type: "raster-dem",
-      url: "mapbox://mapbox.mapbox-terrain-dem-v1",
-      minzoom: 6,
-      maxzoom: 18,
-      tileSize: 256,
-    });
-    return this;
-  }
-
-  setTerrain() {
-    if (!this.map.getSource("raster-dem")) {
-      this.addSource();
-    }
-    this.map.setTerrain({
-      source: "raster-dem",
-      exaggeration: 1.5, // 地形拉升强度（1.0为原始高度）
-    });
-    return this;
-  }
-  
-  addHillshade() {
-    if (!this.map.getSource("raster-dem")) {
-      this.addSource();
-    }
-    this.map.addLayer({
-      id: "hillshade",
-      type: "hillshade",
-      source: "raster-dem",
-      paint: {
-        "hillshade-exaggeration": 0.5, //地形起伏强度（默认 0.5）
-        "hillshade-highlight-color": "#FFFFFF", // 受光面颜色 :ml-citation{ref="1" data="citationList"}
-        "hillshade-shadow-color": "#025505", // 阴影区颜色 :ml-citation{ref="1" data="citationList"}
-      },
-    });
-    return this;
-  }
-}

package/src/manager/VectorManager.ts

@@ -1,51 +0,0 @@
-import type GSMap from "../types/GSMap";
-
-export default class VectorManager {
-  private map: GSMap;
-  constructor(map: GSMap) {
-    this.map = map;
-  }
-
-  addSource(config: any) {
-    if (!this.map.getSource(config.id)) {
-      const source = Object.assign(
-        {
-          type: "geojson",
-          tiles: [config.url],
-          tileSize: 256,
-        },
-        config
-      );
-      this.map.addSource(config.id, source);
-    }
-    return this;
-  }
-
-  addLayer(config: any) {
-    if (!this.map.getLayer(config.id)) {
-      const layer = Object.assign(
-        {
-          id: config.id,
-          source: config.source,
-        },
-        config
-      );
-      this.map.addLayer(layer);
-    }
-    return this;
-  }
-
-  removeSource(id: string) {
-    if (this.map.getSource(id)) {
-      this.map.removeSource(id);
-    }
-    return this;
-  }
-
-  removeLayer(id: string) {
-    if (this.map.getLayer(id)) {
-      this.map.removeLayer(id);
-    }
-    return this;
-  }
-}