cquavui/src/views/cesiums/components/DrawingTool.ts

// src/utils/cesium/DrawingTool.ts
import * as Cesium from 'cesium';

export interface DrawingOptions {
  color?: Cesium.Color;
  outlineColor?: Cesium.Color;
  outlineWidth?: number;
  fill?: boolean;
  classificationType?: Cesium.ClassificationType;
  height?: number;
  extrudedHeight?: number;
}

export interface CircleOptions extends DrawingOptions {
  radius?: number;
}

export interface PolygonOptions extends DrawingOptions {
  closePath?: boolean;
}



export interface DrawingInfo {
  id: string;
  type: 'circle' | 'polygon';
  positions: Cesium.Cartesian3[];
  center?: Cesium.Cartesian3; // 圆心（仅圆形）
  radius?: number; // 半径（仅圆形）
  bounds?: { // 边界信息（仅多边形）
    north: number;
    south: number;
    east: number;
    west: number;
  };
  area: number;
  properties: any;
}

export interface DrawingResult {
  id: string;
  type: 'circle' | 'polygon';
  positions: Cesium.Cartesian3[];
  entity: Cesium.Entity;
  properties: any;
  info: DrawingInfo; // 新增信息字段
}

export class DrawingTool {
  private viewer: Cesium.Viewer;
  private handler: Cesium.ScreenSpaceEventHandler;
  private entities: Cesium.EntityCollection;
  
  private isDrawing: boolean = false;
  private currentType: 'circle' | 'polygon' | null = null;
  private currentPositions: Cesium.Cartesian3[] = [];
  private tempEntities: Cesium.Entity[] = [];
  private drawingEntities: Map<string, DrawingResult> = new Map();
  
  private defaultOptions: DrawingOptions = {
    color: Cesium.Color.YELLOW.withAlpha(0.3),
    outlineColor: Cesium.Color.YELLOW,
    outlineWidth: 2,
    fill: true,
    classificationType: Cesium.ClassificationType.BOTH,
    height: 0,
    extrudedHeight: 1000
  };

  private drawingCallbacks: {
    onStart?: () => void;
    onPointAdd?: (position: Cesium.Cartesian3) => void;
    onComplete?: (result: DrawingResult) => void;
    onCancel?: () => void;
    onClick?: (result: DrawingResult, info: DrawingInfo) => void; // 新增点击回调
  } = {};

  constructor(viewer: Cesium.Viewer) {
    this.viewer = viewer;
    this.handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
    this.entities = viewer.entities;

    // 初始化点击事件监听
    this.initClickHandler();
  }

    /**
   * 初始化点击事件处理器
   */
  private initClickHandler(): void {
      this.handler.setInputAction((event: any) => {
        this.handleEntityClick(event.position);
      }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
  }

    /**
   * 处理实体点击事件
   */
  private handleEntityClick(position: Cesium.Cartesian2): void {
      const pickedObject = this.viewer.scene.pick(position);
      if (!pickedObject || !pickedObject.id) return;
  
      const clickedEntity = pickedObject.id;
      const drawingResult = this.findDrawingByEntity(clickedEntity);
      
      if (drawingResult) {
        const drawingInfo = this.generateDrawingInfo(drawingResult);
        this.drawingCallbacks.onClick?.(drawingResult, drawingInfo);
      }
  }

    /**
   * 根据实体查找绘图结果
   */
  private findDrawingByEntity(entity: Cesium.Entity): DrawingResult | undefined {
      for (const drawing of this.drawingEntities.values()) {
        if (drawing.entity === entity) {
          return drawing;
        }
      }
      return undefined;
  }

    /**
   * 生成绘图信息
   */
  private generateDrawingInfo(drawing: DrawingResult): DrawingInfo {
      if (drawing.type === 'circle') {
        return this.generateCircleInfo(drawing);
      } else {
        return this.generatePolygonInfo(drawing);
      }
  }

  /**
     * 生成圆形信息
     */
  private generateCircleInfo(drawing: DrawingResult): DrawingInfo {
    const center = drawing.positions[0];
    const radius = drawing.positions.length > 1 ? 
      Cesium.Cartesian3.distance(center, drawing.positions[1]) : 
      (drawing.properties.options.radius || 1000);

    const centerCartographic = Cesium.Cartographic.fromCartesian(center);
    const centerLongitude = Cesium.Math.toDegrees(centerCartographic.longitude);
    const centerLatitude = Cesium.Math.toDegrees(centerCartographic.latitude);
    const centerHeight = centerCartographic.height;

    return {
      id: drawing.id,
      type: 'circle',
      positions: drawing.positions,
      center: center,
      radius: radius,
      area: drawing.properties.area,
      properties: {
        ...drawing.properties,
        center: {
          longitude: centerLongitude,
          latitude: centerLatitude,
          height: centerHeight
        },
        radius: radius,
        circumference: 2 * Math.PI * radius,
        diameter: 2 * radius
      }
    };
  }

  /**
     * 生成多边形信息
     */
  private generatePolygonInfo(drawing: DrawingResult): DrawingInfo {
    // 计算边界
    let minLon = Infinity, maxLon = -Infinity;
    let minLat = Infinity, maxLat = -Infinity;
    let minHeight = Infinity, maxHeight = -Infinity;

    const boundaryPoints = drawing.positions.map(position => {
      const cartographic = Cesium.Cartographic.fromCartesian(position);
      const lon = Cesium.Math.toDegrees(cartographic.longitude);
      const lat = Cesium.Math.toDegrees(cartographic.latitude);
      const height = cartographic.height;

      // 更新边界
      minLon = Math.min(minLon, lon);
      maxLon = Math.max(maxLon, lon);
      minLat = Math.min(minLat, lat);
      maxLat = Math.max(maxLat, lat);
      minHeight = Math.min(minHeight, height);
      maxHeight = Math.max(maxHeight, height);

      return {
        longitude: lon,
        latitude: lat,
        height: height
      };
    });

    // 计算中心点
    const centerLon = (minLon + maxLon) / 2;
    const centerLat = (minLat + maxLat) / 2;
    const centerHeight = (minHeight + maxHeight) / 2;

    return {
      id: drawing.id,
      type: 'polygon',
      positions: drawing.positions,
      bounds: {
        north: maxLat,
        south: minLat,
        east: maxLon,
        west: minLon
      },
      area: drawing.properties.area,
      properties: {
        ...drawing.properties,
        boundaryPoints: boundaryPoints,
        bounds: {
          north: maxLat,
          south: minLat,
          east: maxLon,
          west: minLon
        },
        center: {
          longitude: centerLon,
          latitude: centerLat,
          height: centerHeight
        },
        width: this.calculateDistance(minLon, minLat, maxLon, minLat), // 东西宽度
        height: this.calculateDistance(minLon, minLat, minLon, maxLat), // 南北高度
        perimeter: this.calculatePerimeter(drawing.positions)
      }
    };
  }

  /**
     * 计算两点间距离
     */
  private calculateDistance(lon1: number, lat1: number, lon2: number, lat2: number): number {
    const cartesian1 = Cesium.Cartesian3.fromDegrees(lon1, lat1);
    const cartesian2 = Cesium.Cartesian3.fromDegrees(lon2, lat2);
    return Cesium.Cartesian3.distance(cartesian1, cartesian2);
  }

  /**
   * 计算多边形周长
   */
  private calculatePerimeter(positions: Cesium.Cartesian3[]): number {
    let perimeter = 0;
    const n = positions.length;

    for (let i = 0; i < n; i++) {
      const j = (i + 1) % n;
      perimeter += Cesium.Cartesian3.distance(positions[i], positions[j]);
    }

    return perimeter;
  }





  /**
   * 开始绘制圆形
   */
  startDrawingCircle(options: CircleOptions = {}): void {
    this.startDrawing('circle', options);
  }

  /**
   * 开始绘制多边形
   */
  startDrawingPolygon(options: PolygonOptions = {}): void {
    this.startDrawing('polygon', options);
  }

  /**
   * 开始绘制
   */
  private startDrawing(type: 'circle' | 'polygon', options: DrawingOptions = {}): void {
    if (this.isDrawing) {
      this.cancelDrawing();
    }

    this.isDrawing = true;
    this.currentType = type;
    this.currentPositions = [];
    this.tempEntities = [];

    const mergedOptions = { ...this.defaultOptions, ...options };

    // 设置鼠标样式
    this.viewer.scene.canvas.style.cursor = 'crosshair';

    // 左键点击添加点
    this.handler.setInputAction((event: any) => {
      this.handleLeftClick(event.position, mergedOptions);
    }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

    // 鼠标移动预览
    this.handler.setInputAction((event: any) => {
      this.handleMouseMove(event.endPosition, mergedOptions);
    }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

    // 右键完成绘制
    this.handler.setInputAction(() => {
      this.completeDrawing(mergedOptions);
    }, Cesium.ScreenSpaceEventType.RIGHT_CLICK);

    // 取消绘制
    const cancelHandler = (event: KeyboardEvent) => {
      if (event.key === 'Escape') {
        this.cancelDrawing();
      }
    };
    document.addEventListener('keydown', cancelHandler);
    (this as any).cancelHandler = cancelHandler;

    this.drawingCallbacks.onStart?.();
  }

  /**
   * 处理左键点击
   */
  private handleLeftClick(position: Cesium.Cartesian2, options: DrawingOptions): void {
    const cartesian = this.pickCoordinate(position);
    if (!cartesian) return;

    this.currentPositions.push(cartesian);

    // 添加临时点标记
    const pointEntity = this.entities.add({
      position: cartesian,
      point: {
        pixelSize: 8,
        color: Cesium.Color.RED,
        outlineColor: Cesium.Color.WHITE,
        outlineWidth: 2,
        heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
      }
    });
    this.tempEntities.push(pointEntity);

    this.drawingCallbacks.onPointAdd?.(cartesian);

    // 如果是圆形，第一个点确定圆心，第二个点确定半径
    if (this.currentType === 'circle' && this.currentPositions.length === 2) {
      this.completeDrawing(options);
    }
  }

  /**
   * 处理鼠标移动
   */
  private handleMouseMove(position: Cesium.Cartesian2, options: DrawingOptions): void {
    if (this.currentPositions.length === 0) return;

    const cartesian = this.pickCoordinate(position);
    if (!cartesian) return;

    // 清除之前的临时图形
    this.clearTempShapes();

    if (this.currentType === 'circle') {
      this.drawTempCircle(cartesian, options);
    } else if (this.currentType === 'polygon') {
      this.drawTempPolygon(cartesian, options);
    }
  }

  /**
   * 绘制临时圆形
   */
  private drawTempCircle(mousePosition: Cesium.Cartesian3, options: CircleOptions): void {
    const center = this.currentPositions[0];
    const radius = Cesium.Cartesian3.distance(center, mousePosition);

    const circleEntity = this.entities.add({
      position: center,
      ellipse: {
        semiMinorAxis: radius,
        semiMajorAxis: radius,
        material: options.color || this.defaultOptions.color,
        outline: true,
        outlineColor: options.outlineColor || this.defaultOptions.outlineColor,
        outlineWidth: options.outlineWidth || this.defaultOptions.outlineWidth,
        height: options.height || this.defaultOptions.height,
        extrudedHeight: options.extrudedHeight || this.defaultOptions.extrudedHeight,
        classificationType: options.classificationType || this.defaultOptions.classificationType
      }
    });
    this.tempEntities.push(circleEntity);

    // 绘制半径线
    if (this.currentPositions.length === 1) {
      const radiusLine = this.entities.add({
        polyline: {
          positions: [center, mousePosition],
          width: 2,
          material: Cesium.Color.WHITE.withAlpha(0.7)
        }
      });
      this.tempEntities.push(radiusLine);
    }
  }

  /**
   * 绘制临时多边形
   */
  private drawTempPolygon(mousePosition: Cesium.Cartesian3, options: PolygonOptions): void {
    const positions = [...this.currentPositions, mousePosition];

    // 绘制临时多边形
    const polygonEntity = this.entities.add({
      polygon: {
        hierarchy: new Cesium.PolygonHierarchy(positions),
        material: options.color || this.defaultOptions.color,
        outline: true,
        outlineColor: options.outlineColor || this.defaultOptions.outlineColor,
        outlineWidth: options.outlineWidth || this.defaultOptions.outlineWidth,
        height: options.height || this.defaultOptions.height,
        extrudedHeight: options.extrudedHeight || this.defaultOptions.extrudedHeight,
        classificationType: options.classificationType || this.defaultOptions.classificationType
      }
    });
    this.tempEntities.push(polygonEntity);

    // 绘制临时边线
    if (positions.length > 1) {
      const linePositions = [...positions];
      if (positions.length > 2) {
        linePositions.push(positions[0]); // 闭合多边形
      }

      const lineEntity = this.entities.add({
        polyline: {
          positions: linePositions,
          width: 3,
          material: options.outlineColor || this.defaultOptions.outlineColor
        }
      });
      this.tempEntities.push(lineEntity);
    }
  }

  /**
   * 完成绘制
   */
  // private completeDrawing(options: DrawingOptions): void {
  //   if (this.currentPositions.length < 2) {
  //     this.cancelDrawing();
  //     return;
  //   }

  //   const id = `drawing_${Date.now()}`;
  //   let entity: Cesium.Entity;

  //   if (this.currentType === 'circle') {
  //     entity = this.createCircleEntity(id, this.currentPositions, options as CircleOptions);
  //   } else {
  //     entity = this.createPolygonEntity(id, this.currentPositions, options as PolygonOptions);
  //   }

  //   const result: DrawingResult = {
  //     id,
  //     type: this.currentType!,
  //     positions: this.currentPositions,
  //     entity,
  //     properties: {
  //       area: this.calculateArea(this.currentPositions, this.currentType!),
  //       options
  //     }
  //   };

  //   this.drawingEntities.set(id, result);
  //   this.cleanupDrawing();

  //   this.drawingCallbacks.onComplete?.(result);
  // }

   /**
   * 完成绘制
   */
  private completeDrawing(options: DrawingOptions): void {
    if (this.currentPositions.length < 2) {
      this.cancelDrawing();
      return;
    }

    const id = `drawing_${Date.now()}`;
    let entity: Cesium.Entity;

    if (this.currentType === 'circle') {
      entity = this.createCircleEntity(id, this.currentPositions, options as CircleOptions);
    } else {
      entity = this.createPolygonEntity(id, this.currentPositions, options as PolygonOptions);
    }

    // 生成绘图信息
    const drawingInfo = this.currentType === 'circle' ? 
      this.generateCircleInfo({ id, type: 'circle', positions: this.currentPositions, entity, properties: { options, area: 0 } } as DrawingResult) :
      this.generatePolygonInfo({ id, type: 'polygon', positions: this.currentPositions, entity, properties: { options, area: 0 } } as DrawingResult);

    // 计算面积
    const area = this.calculateArea(this.currentPositions, this.currentType!);

    const result: DrawingResult = {
      id,
      type: this.currentType!,
      positions: this.currentPositions,
      entity,
      properties: {
        area: area,
        options
      },
      info: {
        ...drawingInfo,
        area: area
      }
    };

    this.drawingEntities.set(id, result);
    this.cleanupDrawing();

    this.drawingCallbacks.onComplete?.(result);
  }

  /**
   * 创建圆形实体
   */
  // private createCircleEntity(id: string, positions: Cesium.Cartesian3[], options: CircleOptions): Cesium.Entity {
  //   const center = positions[0];
  //   const radius = positions.length > 1 ? Cesium.Cartesian3.distance(center, positions[1]) : (options.radius || 1000);

  //   return this.entities.add({
  //     id,
  //     position: center,
  //     ellipse: {
  //       semiMinorAxis: radius,
  //       semiMajorAxis: radius,
  //       material: options.color || this.defaultOptions.color,
  //       outline: true,
  //       outlineColor: options.outlineColor || this.defaultOptions.outlineColor,
  //       outlineWidth: options.outlineWidth || this.defaultOptions.outlineWidth,
  //       height: options.height || this.defaultOptions.height,
  //       extrudedHeight: options.extrudedHeight || this.defaultOptions.extrudedHeight,
  //       classificationType: options.classificationType || this.defaultOptions.classificationType
  //     },
  //     label: {
  //       text: `圆形空域\n半径: ${(radius / 1000).toFixed(2)}km`,
  //       font: '14pt sans-serif',
  //       pixelOffset: new Cesium.Cartesian2(0, -50),
  //       fillColor: Cesium.Color.WHITE,
  //       outlineColor: Cesium.Color.BLACK,
  //       outlineWidth: 2,
  //       style: Cesium.LabelStyle.FILL_AND_OUTLINE,
  //       heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
  //     }
  //   });
  // }

  /**
   * 创建圆形实体
   */
  private createCircleEntity(id: string, positions: Cesium.Cartesian3[], options: CircleOptions): Cesium.Entity {
    const center = positions[0];
    const radius = positions.length > 1 ? Cesium.Cartesian3.distance(center, positions[1]) : (options.radius || 1000);
    const centerCartographic = Cesium.Cartographic.fromCartesian(center);

    return this.entities.add({
      id,
      position: center,
      ellipse: {
        semiMinorAxis: radius,
        semiMajorAxis: radius,
        material: options.color || this.defaultOptions.color,
        outline: true,
        outlineColor: options.outlineColor || this.defaultOptions.outlineColor,
        outlineWidth: options.outlineWidth || this.defaultOptions.outlineWidth,
        height: options.height || this.defaultOptions.height,
        extrudedHeight: options.extrudedHeight || this.defaultOptions.extrudedHeight,
        classificationType: options.classificationType || this.defaultOptions.classificationType
      },
      label: {
        text: `圆形空域\n半径: ${(radius / 1000).toFixed(2)}km`,
        font: '14pt sans-serif',
        pixelOffset: new Cesium.Cartesian2(0, -50),
        fillColor: Cesium.Color.WHITE,
        outlineColor: Cesium.Color.BLACK,
        outlineWidth: 2,
        style: Cesium.LabelStyle.FILL_AND_OUTLINE,
        heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
      },
      // 添加自定义属性便于识别
      drawingType: 'circle',
      drawingId: id
    });
    console.log("圆形空域:",)
  }

  /**
   * 创建多边形实体
   */
  private createPolygonEntity(id: string, positions: Cesium.Cartesian3[], options: PolygonOptions): Cesium.Entity {
    const hierarchy = new Cesium.PolygonHierarchy(positions);
    const area = this.calculateArea(positions, 'polygon');

    return this.entities.add({
      id,
      polygon: {
        hierarchy,
        material: options.color || this.defaultOptions.color,
        outline: true,
        outlineColor: options.outlineColor || this.defaultOptions.outlineColor,
        outlineWidth: options.outlineWidth || this.defaultOptions.outlineWidth,
        height: options.height || this.defaultOptions.height,
        extrudedHeight: options.extrudedHeight || this.defaultOptions.extrudedHeight,
        classificationType: options.classificationType || this.defaultOptions.classificationType
      },
      label: {
        text: `多边形空域\n面积: ${(area / 1000000).toFixed(2)}km²`,
        font: '14pt sans-serif',
        pixelOffset: new Cesium.Cartesian2(0, -50),
        fillColor: Cesium.Color.WHITE,
        outlineColor: Cesium.Color.BLACK,
        outlineWidth: 2,
        style: Cesium.LabelStyle.FILL_AND_OUTLINE,
        heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
      },
      // 添加自定义属性便于识别
      drawingType: 'polygon',
      drawingId: id
    });
  }

  /**
   * 创建多边形实体
   */
  // private createPolygonEntity(id: string, positions: Cesium.Cartesian3[], options: PolygonOptions): Cesium.Entity {
  //   const hierarchy = new Cesium.PolygonHierarchy(positions);
  //   const area = this.calculateArea(positions, 'polygon');

  //   return this.entities.add({
  //     id,
  //     polygon: {
  //       hierarchy,
  //       material: options.color || this.defaultOptions.color,
  //       outline: true,
  //       outlineColor: options.outlineColor || this.defaultOptions.outlineColor,
  //       outlineWidth: options.outlineWidth || this.defaultOptions.outlineWidth,
  //       height: options.height || this.defaultOptions.height,
  //       extrudedHeight: options.extrudedHeight || this.defaultOptions.extrudedHeight,
  //       classificationType: options.classificationType || this.defaultOptions.classificationType
  //     },
  //     label: {
  //       text: `多边形空域\n面积: ${(area / 1000000).toFixed(2)}km²`,
  //       font: '14pt sans-serif',
  //       pixelOffset: new Cesium.Cartesian2(0, -50),
  //       fillColor: Cesium.Color.WHITE,
  //       outlineColor: Cesium.Color.BLACK,
  //       outlineWidth: 2,
  //       style: Cesium.LabelStyle.FILL_AND_OUTLINE,
  //       heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
  //     }
  //   });
  // }


   /**
   * 打印空域基本信息
   */
   printDrawingInfo(drawingId: string): void {
    const drawing = this.drawingEntities.get(drawingId);
    if (!drawing) {
      console.warn(`未找到ID为 ${drawingId} 的空域`);
      return;
    }

    const info = this.generateDrawingInfo(drawing);
    this.printFormattedInfo(info);
  }

  /**
   * 打印所有空域信息
   */
  printAllDrawingsInfo(): void {
    if (this.drawingEntities.size === 0) {
      console.log('当前没有绘制任何空域');
      return;
    }

    console.log(`=== 空域信息汇总 (共 ${this.drawingEntities.size} 个) ===`);
    this.drawingEntities.forEach((drawing, id) => {
      const info = this.generateDrawingInfo(drawing);
      this.printFormattedInfo(info);
      console.log('---'); // 分隔线
    });
  }

  /**
   * 格式化打印信息
   */
  private printFormattedInfo(info: DrawingInfo): void {
    const { id, type, area, properties } = info;

    console.log(`🛡️ 空域ID: ${id}`);
    console.log(`📝 类型: ${type === 'circle' ? '圆形空域' : '多边形空域'}`);
    console.log(`📊 面积: ${(area / 1000000).toFixed(3)} km²`);

    if (type === 'circle') {
      const center = properties.center;
      console.log(`📍 圆心坐标:`);
      console.log(`   经度: ${center.longitude.toFixed(6)}°`);
      console.log(`   纬度: ${center.latitude.toFixed(6)}°`);
      console.log(`   高程: ${center.height.toFixed(2)} 米`);
      console.log(`📏 半径: ${(info.radius! / 1000).toFixed(3)} km`);
      console.log(`📐 直径: ${(info.radius! * 2 / 1000).toFixed(3)} km`);
      console.log(`🔄 周长: ${(properties.circumference / 1000).toFixed(3)} km`);
    } else {
      const center = properties.center;
      const bounds = properties.bounds;
      const boundaryPoints = properties.boundaryPoints;

      console.log(`📍 中心点坐标:`);
      console.log(`   经度: ${center.longitude.toFixed(6)}°`);
      console.log(`   纬度: ${center.latitude.toFixed(6)}°`);
      console.log(`   高程: ${center.height.toFixed(2)} 米`);

      console.log(`🗺️ 边界范围:`);
      console.log(`   北: ${bounds.north.toFixed(6)}°`);
      console.log(`   南: ${bounds.south.toFixed(6)}°`);
      console.log(`   东: ${bounds.east.toFixed(6)}°`);
      console.log(`   西: ${bounds.west.toFixed(6)}°`);

      console.log(`📏 尺寸信息:`);
      console.log(`   宽度: ${(properties.width / 1000).toFixed(3)} km`);
      console.log(`   高度: ${(properties.height / 1000).toFixed(3)} km`);
      console.log(`   周长: ${(properties.perimeter / 1000).toFixed(3)} km`);

      console.log(`📍 边界顶点 (${boundaryPoints.length}个):`);
      boundaryPoints.forEach((point, index) => {
        console.log(`   顶点${index + 1}: ${point.longitude.toFixed(6)}°, ${point.latitude.toFixed(6)}°, ${point.height.toFixed(2)}米`);
      });
    }

    console.log(`🎨 样式设置:`);
    console.log(`   填充颜色: ${properties.options.color}`);
    console.log(`   边框颜色: ${properties.options.outlineColor}`);
    console.log(`   边框宽度: ${properties.options.outlineWidth}px`);
    console.log(`   拉伸高度: ${properties.options.extrudedHeight}米`);
  }

  /**
   * 获取空域信息的JSON格式
   */
  getDrawingInfoJSON(drawingId: string): any {
    const drawing = this.drawingEntities.get(drawingId);
    if (!drawing) return null;

    const info = this.generateDrawingInfo(drawing);
    return this.formatInfoToJSON(info);
  }

  /**
   * 获取所有空域信息的JSON格式
   */
  getAllDrawingsInfoJSON(): any[] {
    const result = [];
    for (const [id, drawing] of this.drawingEntities) {
      const info = this.generateDrawingInfo(drawing);
      result.push(this.formatInfoToJSON(info));
    }
    return result;
  }

  /**
   * 格式化信息为JSON
   */
  private formatInfoToJSON(info: DrawingInfo): any {
    const jsonInfo: any = {
      id: info.id,
      type: info.type,
      area: {
        squareMeters: info.area,
        squareKilometers: info.area / 1000000
      },
      properties: {
        ...info.properties,
        options: {
          color: info.properties.options.color?.toCssColorString(),
          outlineColor: info.properties.options.outlineColor?.toCssColorString(),
          outlineWidth: info.properties.options.outlineWidth,
          extrudedHeight: info.properties.options.extrudedHeight
        }
      }
    };

    // 移除循环引用
    delete jsonInfo.properties.boundaryPoints;
    delete jsonInfo.properties.center;

    if (info.type === 'circle') {
      jsonInfo.circle = {
        center: info.properties.center,
        radius: info.radius,
        diameter: info.radius! * 2,
        circumference: info.properties.circumference
      };
    } else {
      jsonInfo.polygon = {
        center: info.properties.center,
        bounds: info.properties.bounds,
        dimensions: {
          width: info.properties.width,
          height: info.properties.height,
          perimeter: info.properties.perimeter
        },
        vertexCount: info.properties.boundaryPoints.length,
        vertices: info.properties.boundaryPoints
      };
    }

    return jsonInfo;
  }

  /**
   * 导出空域信息为文本
   */
  exportDrawingInfoAsText(drawingId: string): string {
    const drawing = this.drawingEntities.get(drawingId);
    if (!drawing) return '';

    const info = this.generateDrawingInfo(drawing);
    return this.formatInfoAsText(info);
  }

  /**
   * 格式化信息为文本
   */
  private formatInfoAsText(info: DrawingInfo): string {
    let text = '';

    if (info.type === 'circle') {
      const center = info.properties.center;
      text = `圆形空域信息
    空域ID: ${info.id}
    圆心坐标: 经度${center.longitude.toFixed(6)}°, 纬度${center.latitude.toFixed(6)}°, 高程${center.height.toFixed(2)}米
    半径: ${(info.radius! / 1000).toFixed(3)} km
    直径: ${(info.radius! * 2 / 1000).toFixed(3)} km
    周长: ${(info.properties.circumference / 1000).toFixed(3)} km
    面积: ${(info.area / 1000000).toFixed(3)} km²`;
        } else {
          const center = info.properties.center;
          const bounds = info.properties.bounds;
          text = `多边形空域信息
    空域ID: ${info.id}
    中心点: 经度${center.longitude.toFixed(6)}°, 纬度${center.latitude.toFixed(6)}°, 高程${center.height.toFixed(2)}米
    边界范围: 北${bounds.north.toFixed(6)}° 南${bounds.south.toFixed(6)}° 东${bounds.east.toFixed(6)}° 西${bounds.west.toFixed(6)}°
    尺寸: 宽度${(info.properties.width / 1000).toFixed(3)}km 高度${(info.properties.height / 1000).toFixed(3)}km
    周长: ${(info.properties.perimeter / 1000).toFixed(3)} km
    面积: ${(info.area / 1000000).toFixed(3)} km²
    顶点数量: ${info.properties.boundaryPoints.length}`;

          // 添加顶点信息
          info.properties.boundaryPoints.forEach((point, index) => {
            text += `\n顶点${index + 1}: 经度${point.longitude.toFixed(6)}°, 纬度${point.latitude.toFixed(6)}°, 高程${point.height.toFixed(2)}米`;
          });
        }

        return text;
  }





  /**
   * 计算面积
   */
  private calculateArea(positions: Cesium.Cartesian3[], type: 'circle' | 'polygon'): number {
    if (type === 'circle') {
      const center = positions[0];
      console.log("圆形的圆心：",center)
      const radius = positions.length > 1 ? Cesium.Cartesian3.distance(center, positions[1]) : 0;
      console.log("圆形的半径：",radius)
      return Math.PI * radius * radius;
    } else {
      // 计算多边形面积
      // const cartographics = positions.map(pos => 
      //   Cesium.Cartographic.fromCartesian(pos)
      // );
      // return Cesium.PolygonGeometry.computeArea(cartographics);

       // 修正：使用正确的多边形面积计算方法
       const area = this.computePolygonAreaSimple(positions);
       console.log(`Polygon area: ${area} m², vertices: ${positions.length}`);
       return area;
    }
  }

  /**
   * 简化但有效的多边形面积计算
   */
  private computePolygonAreaSimple(positions: Cesium.Cartesian3[]): number {
    if (positions.length < 3) return 0;

    // 将3D坐标转换为2D平面坐标（使用第一个点作为参考平面）
    const normal = new Cesium.Cartesian3();
    Cesium.Ellipsoid.WGS84.geodeticSurfaceNormal(positions[0], normal);
    
    let area = 0;
    const n = positions.length;

    for (let i = 0; i < n; i++) {
      const j = (i + 1) % n;
      
      const p1 = positions[i];
      const p2 = positions[j];
      
      // 计算两个向量在切平面上的投影
      const v1 = Cesium.Cartesian3.subtract(p1, positions[0], new Cesium.Cartesian3());
      const v2 = Cesium.Cartesian3.subtract(p2, positions[0], new Cesium.Cartesian3());
      
      // 计算叉积的模长（平行四边形面积）
      const cross = Cesium.Cartesian3.cross(v1, v2, new Cesium.Cartesian3());
      const parallelogramArea = Cesium.Cartesian3.magnitude(cross);
      
      area += parallelogramArea;
    }

    // 三角形面积是平行四边形面积的一半
    return Math.abs(area) / 2;
  }


  /**
   * 取消绘制
   */
  cancelDrawing(): void {
    this.cleanupDrawing();
    this.drawingCallbacks.onCancel?.();
  }

  /**
   * 清理绘制状态
   */
  private cleanupDrawing(): void {
    this.isDrawing = false;
    this.currentType = null;
    this.currentPositions = [];

    // 清除临时实体
    this.tempEntities.forEach(entity => this.entities.remove(entity));
    this.tempEntities = [];

    // 移除事件监听
    this.handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
    this.handler.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE);
    this.handler.removeInputAction(Cesium.ScreenSpaceEventType.RIGHT_CLICK);

    // 移除键盘事件
    if ((this as any).cancelHandler) {
      document.removeEventListener('keydown', (this as any).cancelHandler);
      (this as any).cancelHandler = null;
    }

    // 恢复鼠标样式
    this.viewer.scene.canvas.style.cursor = '';
  }

  /**
   * 清除临时图形
   */
  private clearTempShapes(): void {
    this.tempEntities.forEach(entity => this.entities.remove(entity));
    this.tempEntities = [];
  }

  /**
   * 拾取坐标
   */
  private pickCoordinate(position: Cesium.Cartesian2): Cesium.Cartesian3 | null {
    const ray = this.viewer.camera.getPickRay(position);
    if (!ray) return null;

    const cartesian = this.viewer.scene.globe.pick(ray, this.viewer.scene) ||
                     this.viewer.scene.camera.pickEllipsoid(position, this.viewer.scene.globe.ellipsoid);
    return cartesian;
  }

  /**
   * 设置绘图回调
   */
  setCallbacks(callbacks: typeof this.drawingCallbacks): void {
    this.drawingCallbacks = { ...this.drawingCallbacks, ...callbacks };
  }

  /**
   * 获取所有绘制的图形
   */
  getAllDrawings(): DrawingResult[] {
    return Array.from(this.drawingEntities.values());
  }

  /**
   * 根据ID获取图形
   */
  getDrawing(id: string): DrawingResult | undefined {
    return this.drawingEntities.get(id);
  }

  /**
   * 移除图形
   */
  removeDrawing(id: string): boolean {
    const drawing = this.drawingEntities.get(id);
    if (drawing) {
      this.entities.remove(drawing.entity);
      this.drawingEntities.delete(id);
      return true;
    }
    return false;
  }

  /**
   * 清除所有图形
   */
  clearAllDrawings(): void {
    this.drawingEntities.forEach(drawing => {
      this.entities.remove(drawing.entity);
    });
    this.drawingEntities.clear();
  }

  /**
   * 高亮显示图形
   */
  highlightDrawing(id: string, highlight: boolean = true): void {
    const drawing = this.drawingEntities.get(id);
    if (!drawing) return;

    if (drawing.type === 'circle' && drawing.entity.ellipse) {
      drawing.entity.ellipse.outlineColor = highlight ? 
        Cesium.Color.RED : 
        (drawing.properties.options.outlineColor || this.defaultOptions.outlineColor);
      drawing.entity.ellipse.outlineWidth = highlight ? 4 : 2;
    } else if (drawing.entity.polygon) {
      drawing.entity.polygon.outlineColor = highlight ? 
        Cesium.Color.RED : 
        (drawing.properties.options.outlineColor || this.defaultOptions.outlineColor);
      drawing.entity.polygon.outlineWidth = highlight ? 4 : 2;
    }
  }

  /**
   * 飞向图形
   */
  // flyToDrawing(id: string, duration: number = 2): void {
  //   console.log("飞飞飞非法欸")
  //   const drawing = this.drawingEntities.get(id);
  //   console.log("飞飞飞非111")
  //   if (drawing) {
  //     console.log("飞飞飞222")
  //     this.viewer.flyTo(drawing.entity, {
  //       duration: duration,
  //       offset: new Cesium.HeadingPitchRange(0, -0.5, 0)
  //     });
  //   }
  // }


  /**
   * 飞向图形
   */
  flyToDrawing(id: string, duration: number = 2): void {
    console.log('=== flyToDrawing 开始执行 ===');
    console.log('目标空域ID:', id);
    
    const drawing = this.drawingEntities.get(id);
    if (!drawing) {
      console.error('❌ 未找到空域:', id);
      return;
    }

    console.log('找到空域:', drawing);
    
    try {
      if (drawing.type === 'circle') {
        // 对于圆形，飞到圆心上方
        const center = drawing.positions[0];
        const radius = drawing.positions.length > 1 ? 
          Cesium.Cartesian3.distance(center, drawing.positions[1]) : 
          (drawing.properties.options.radius || 1000);
        
        const height = radius * 2 + 500; // 在半径2倍高度加上500米
        
        console.log('圆形空域 - 圆心:', center);
        console.log('圆形空域 - 半径:', radius);
        console.log('圆形空域 - 飞行高度:', height);
        
        this.viewer.camera.flyTo({
          destination: center,
          orientation: {
            heading: 0,
            pitch: -Math.PI/4,
            roll: 0
          },
          duration: duration,
          complete: () => {
            console.log('✅ 飞向圆形空域完成');
          },
          cancel: () => {
            console.log('❌ 飞向圆形空域取消');
          }
        });
        
      } else {
        // 对于多边形，飞到边界框
        console.log('多边形空域 - 实体:', drawing.entity);
        
        this.viewer.flyTo(drawing.entity, {
          duration: duration,
          offset: new Cesium.HeadingPitchRange(0, -Math.PI/4, 0),
          complete: () => {
            console.log('✅ 飞向多边形空域完成');
          },
          cancel: () => {
            console.log('❌ 飞向多边形空域取消');
          }
        });
      }
      
      console.log('✅ flyTo 命令已发送');
      
    } catch (error) {
      console.error('❌ 飞向空域时发生错误:', error);
    }
  }

  /**
   * 飞向图形（改进版本）
   */
  flyToDrawingImproved(id: string, duration: number = 2): void {
    console.log('=== flyToDrawingImproved 开始执行 ===');
    
    const drawing = this.drawingEntities.get(id);
    if (!drawing) {
      console.error('❌ 未找到空域:', id);
      return;
    }

    try {
      // 计算实体的边界球
      const boundingSphere = this.computeEntityBoundingSphere(drawing.entity);
      if (!boundingSphere) {
        console.error('❌ 无法计算边界球');
        return;
      }

      console.log('边界球:', boundingSphere);
      
      // 飞到边界球
      this.viewer.camera.flyToBoundingSphere(boundingSphere, {
        duration: duration,
        offset: new Cesium.HeadingPitchRange(0, -Math.PI/4, boundingSphere.radius * 3),
        complete: () => {
          console.log('✅ 飞向空域完成');
        },
        cancel: () => {
          console.log('❌ 飞向空域取消');
        }
      });
      
    } catch (error) {
      console.error('❌ 飞向空域时发生错误:', error);
    }
  }

  /**
   * 计算实体的边界球
   */
  private computeEntityBoundingSphere(entity: Cesium.Entity): Cesium.BoundingSphere | null {
    try {
      // 方法1: 使用 Cesium 的 computeBoundingSphere
      if (entity.polygon || entity.ellipse) {
        const boundingSphere = entity.computeBoundingSphere();
        if (boundingSphere) {
          return boundingSphere;
        }
      }

      // 方法2: 手动计算边界球
      if (entity.polygon && entity.polygon.hierarchy) {
        const hierarchy = entity.polygon.hierarchy.getValue(Cesium.JulianDate.now());
        if (hierarchy && hierarchy.positions) {
          return Cesium.BoundingSphere.fromPoints(hierarchy.positions);
        }
      }

      // 方法3: 对于椭圆，使用位置和半径
      if (entity.ellipse && entity.position) {
        const position = entity.position.getValue(Cesium.JulianDate.now());
        const semiMajorAxis = entity.ellipse.semiMajorAxis?.getValue(Cesium.JulianDate.now()) || 1000;
        const semiMinorAxis = entity.ellipse.semiMinorAxis?.getValue(Cesium.JulianDate.now()) || 1000;
        const radius = Math.max(semiMajorAxis, semiMinorAxis);
        
        return new Cesium.BoundingSphere(position, radius);
      }

      return null;
    } catch (error) {
      console.error('计算边界球时发生错误:', error);
      return null;
    }
  }

  /**
   * 飞向图形的简单方法
   */
  flyToDrawingSimple(id: string, duration: number = 2): void {
    console.log('=== flyToDrawingSimple 开始执行 ===');
    
    const drawing = this.drawingEntities.get(id);
    if (!drawing) {
      console.error('❌ 未找到空域:', id);
      return;
    }

    try {
      // 获取实体的位置
      const position = drawing.entity.position?.getValue(Cesium.JulianDate.now());
      if (!position) {
        console.error('❌ 无法获取实体位置');
        return;
      }

      console.log('实体位置:', position);

      // 转换到经纬度
      const cartographic = Cesium.Cartographic.fromCartesian(position);
      const longitude = Cesium.Math.toDegrees(cartographic.longitude);
      const latitude = Cesium.Math.toDegrees(cartographic.latitude);
      const height = cartographic.height + 2000; // 在实体高度上加2000米

      console.log('目标位置 - 经度:', longitude, '纬度:', latitude, '高度:', height);

      // 飞到该位置
      this.viewer.camera.flyTo({
        destination: Cesium.Cartesian3.fromDegrees(longitude, latitude, height),
        orientation: {
          heading: 0,
          pitch: -Math.PI/3, // -60度俯角
          roll: 0
        },
        duration: duration,
        complete: () => {
          console.log('✅ 飞向空域完成');
        },
        cancel: () => {
          console.log('❌ 飞向空域取消');
        }
      });

    } catch (error) {
      console.error('❌ 飞向空域时发生错误:', error);
    }
  }

  /**
   * 导出图形数据
   */
  exportDrawings(): any[] {
    return this.getAllDrawings().map(drawing => ({
      id: drawing.id,
      type: drawing.type,
      positions: drawing.positions.map(pos => {
        const cartographic = Cesium.Cartographic.fromCartesian(pos);
        return {
          longitude: Cesium.Math.toDegrees(cartographic.longitude),
          latitude: Cesium.Math.toDegrees(cartographic.latitude),
          height: cartographic.height
        };
      }),
      properties: drawing.properties
    }));
  }

  /**
   * 导入图形数据
   */
  importDrawings(data: any[]): void {
    data.forEach(item => {
      const positions = item.positions.map((pos: any) => 
        Cesium.Cartesian3.fromDegrees(pos.longitude, pos.latitude, pos.height)
      );

      let entity: Cesium.Entity;
      if (item.type === 'circle') {
        entity = this.createCircleEntity(item.id, positions, item.properties.options);
      } else {
        entity = this.createPolygonEntity(item.id, positions, item.properties.options);
      }

      const drawing: DrawingResult = {
        id: item.id,
        type: item.type,
        positions,
        entity,
        properties: item.properties
      };

      this.drawingEntities.set(item.id, drawing);
    });
  }

  /**
   * 销毁
   */
  destroy(): void {
    this.cancelDrawing();
    this.clearAllDrawings();
    this.handler.destroy();
  }
}