新增数据平面展示方式

riku

2025-02-14 66090d06a87ff940fd5fc138d7260c755a5a3127

 src/utils/map/line.js

@@ -4,6 +4,21 @@

var _polylineArr = [];

function newPolyline(path, color) {
  // eslint-disable-next-line no-undef
  return new AMap.Polyline({
    path: path,
    strokeStyle: 'solid',
    isOutline: true,
    borderWeight: 1,
    outlineColor: 'white',
    strokeWeight: 4, // 线条宽度，默认为 1
    strokeColor: color, // 线条颜色
    lineJoin: 'round', // 折线拐点连接处样式
    showDir: true
  });
}

export default {
  drawLine(fDatas, factor) {
    const lnglats_GD = fDatas.lnglats_GD;
@@ -17,24 +32,58 @@

    let sIndex = 0;
    for (let i = 1; i < path.length; i++) {
      // if (colors[i] == colors[i - 1]) {
      // } else {
      // }
      const _path = [path[i], path[i + 1]];
      const _color = getHexColor(colors[i + 1].map((v) => v * 255));
      // 创建折线实例
      var r = lnglats_GD[i];
      var lastP = lnglats_GD[i - 1];
      // eslint-disable-next-line no-undef
      const polyline = new AMap.Polyline({
        path: _path,
        strokeStyle: 'solid',
        isOutline: true,
        borderWeight: 2,
        outlineColor: 'white',
        strokeWeight: 4, // 线条宽度，默认为 1
        strokeColor: _color, // 线条颜色
        lineJoin: 'round', // 折线拐点连接处样式
        showDir: true
      });
      var distance = AMap.GeometryUtil.distance(r, lastP);
      const c = colors[i];
      const lastC = colors[i - 1];
      if (distance > 500 || c != lastC) {
        let _path, _color;
        // 当两点距离超过500时，认为两点不连续，不绘制连线
        if (distance > 500) {
          _path = path.slice(sIndex, i);
          _color = getHexColor(
            lastC.map((v, index) => {
              if (index < lastC.length - 1) {
                return v * 255;
              } else {
                return v;
              }
            })
          );
        } else {
          _path = path.slice(sIndex, i + 1);
          _color = getHexColor(
            c.map((v, index) => {
              if (index < c.length - 1) {
                return v * 255;
              } else {
                return v;
              }
            })
          );
        }

        // 创建折线实例
        const polyline = newPolyline(_path, _color);
        _polylineArr.push(polyline);

        sIndex = i;
      }
    }
    if (sIndex == 0) {
      const c = colors[sIndex];
      const _color = getHexColor(
        c.map((v, index) => {
          if (index < c.length - 1) {
            return v * 255;
          } else {
            return v;
          }
        })
      );
      const polyline = newPolyline(path, _color);
      _polylineArr.push(polyline);
    }
    // 将折线添加至地图实例