traffic-laser/src/graphic/Geometry/SVG.js

import VectorType from "../enum/VectorType.js";
import Geometry from "./Geometry.js";
import { mathUtil } from "../Util/MathUtil.js";
import { coordinate } from "../Coordinate.js";
import Constant from "../Constant.js";

//const sideWidth = 10;
export default class SVG extends Geometry {
  constructor(center, type, vectorId) {
    super();
    this.center = center;
    this.points = null; //包裹的矩形的四个顶点
    this.angle = 0; //逆时针为负，顺时针为正。单位是：°
    this.type = type;
    this.geoType = VectorType.SVG;
    this.scale = this.getScale(); //缩放比例
    this.setBoundingVertexs();
    this.setId(vectorId);
  }

  // createDefaultPoints() {
  //   this.points = [];
  //   this.points[0] = {
  //     x: this.center.x - sideWidth / 2,
  //     y: this.center.y + sideWidth / 2,
  //   };
  //   this.points[1] = {
  //     x: this.center.x + sideWidth / 2,
  //     y: this.center.y + sideWidth / 2,
  //   };
  //   this.points[2] = {
  //     x: this.center.x + sideWidth / 2,
  //     y: this.center.y - sideWidth / 2,
  //   };
  //   this.points[3] = {
  //     x: this.center.x - sideWidth / 2,
  //     y: this.center.y - sideWidth / 2,
  //   };
  // }

  setBoundingVertexs() {
    this.points = [];
    const rec = this.getLengthWidth();
    const length = this.scale * rec.length;
    const width = this.scale * rec.width;

    const minX = this.center.x - length / 2;
    const minY = this.center.y - width / 2;
    const maxX = this.center.x + length / 2;
    const maxY = this.center.y + width / 2;

    const point1 = this.rotatePoint(
      {
        x: minX,
        y: maxY,
      },
      this.center,
      this.angle
    );

    const point2 = this.rotatePoint(
      {
        x: maxX,
        y: maxY,
      },
      this.center,
      this.angle
    );

    const point3 = this.rotatePoint(
      {
        x: maxX,
        y: minY,
      },
      this.center,
      this.angle
    );

    const point4 = this.rotatePoint(
      {
        x: minX,
        y: minY,
      },
      this.center,
      this.angle
    );

    this.points.push(point1);
    this.points.push(point2);
    this.points.push(point3);
    this.points.push(point4);
  }

  setBoundingVertexs2(position, pointIndex) {
    if (mathUtil.getDistance(position, this.center) < Constant.minAdsorbPix) {
      return;
    }
    mathUtil.clonePoint(this.points[pointIndex], position);
    // 【注意】angle 逆时针为正，顺时针为负
    let nextIndex = this.getNextIndex(pointIndex);
    this.points[nextIndex] = this.rotatePoint(position, this.center, 90);
    nextIndex = this.getNextIndex(nextIndex);
    this.points[nextIndex] = this.rotatePoint(position, this.center, 180);
    nextIndex = this.getNextIndex(nextIndex);
    this.points[nextIndex] = this.rotatePoint(position, this.center, 270);
  }

  getNextIndex(index) {
    let nextIndex = index + 1;
    if (nextIndex > 3) {
      nextIndex = nextIndex - 4;
    }
    return nextIndex;
  }

  //不同图例，缩放比不一样
  getScale() {
    return 1;
  }

  getLengthWidth() {
    return {
      length: 100,
      width: 100,
    };
  }
}