各模块功能新增

riku

2025-03-07 2592dc279ec82bf3649a4dbe644c6416263a10ef

 src/utils/map/grid.js

@@ -84,15 +84,17 @@
 * 文本标记
 * 可修改position
 */
function textMaker(position, text, anchor, type) {
function textMaker({ position, text, anchor, type, color }) {
  let style = {};
  if (type == 'data') {
    style = {
      'font-size': '12px',
      'text-align': 'center',
      color: 'white',
      'font-weight': 600,
      color: color ? color : 'white',
      background: '#122b54a9',
      'text-shadow': 'black 2px 2px 2px',
      // background: 'white',
      'text-shadow': 'black 1px 1px 1px',
      border: '0px',
      'margin-top': '4px'
    };
@@ -100,11 +102,12 @@
    style = {
      'font-size': '14px',
      'text-align': 'center',
      color: 'white',
      color: color ? color : 'white',
      background: 'transparent',
      'text-shadow': 'black 2px 2px 2px',
      'border-radius': '2px',
      border: '1px solid #122b54a9',
      // border: '1px solid rgba(255, 255, 255, 0.62)',
      'margin-bottom': '4px'
    };
  }
@@ -152,6 +155,60 @@
      }
    }
  });
}

/**
 * 计算每个网格颜色
 */
function calGridColor({ factorName, data, isCustomColor }) {
  let _colorList = [];
  if (isCustomColor) {
    var max, min;
    data.forEach((t) => {
      if (!t) return;
      if (!max || t > max) {
        max = t;
      }
      if (!min || t < min) {
        min = t;
      }
    });
    data.forEach((d) => {
      if (d) {
        // 根据遥测数据计算网格颜色
        const { color, nextColor, range, nextRange } =
          Legend.getCustomColorAndNext(d, min, max);
        const ratio = (d - range) / (nextRange - range);

        const _color = getColorBetweenTwoColors(
          color.map((v) => v * 255),
          nextColor.map((v) => v * 255),
          ratio
        );
        _colorList.push(_color);
      } else {
        _colorList.push(undefined);
      }
    });
  } else {
    data.forEach((d) => {
      if (d) {
        // 根据遥测数据计算网格颜色
        const { color, nextColor, range, nextRange } =
          Legend.getStandardColorAndNext(factorName, d);
        const ratio = (d - range) / (nextRange - range);
        const _color = getColorBetweenTwoColors(
          color.map((v) => v * 255),
          nextColor.map((v) => v * 255),
          ratio
        );
        _colorList.push(_color);
      } else {
        _colorList.push(undefined);
      }
    });
  }
  return _colorList;
}

export default {
@@ -222,28 +279,27 @@
    return gridViews;
  },

  drawGridText(points, textViews, anchor, type) {
    // if (textViews) {
    //   points.forEach((p, i) => {
    //     textViews[i].setPosition(p.lnglat_GD);
    //     textViews[i].setText(p.data);
    //   });
    //   return textViews;
    // } else {
    //   const _textViews = [];
    //   points.forEach((p) => {
    //     const m = textMaker(p.lnglat_GD, p.data, anchor, type);
    //     _textViews.push(m);
    //   });
    //   map.add(_textViews);
    //   return { textViews: _textViews };
    // }
  drawGridText({ points, textViews, anchor, type, isCustomColor, useColor }) {
    let colorList = [];
    if (useColor) {
      colorList = calGridColor({
        factorName: 'PM25',
        data: points.map((p) => p.data),
        isCustomColor: isCustomColor
      });
    }
    if (textViews) {
      map.remove(textViews);
    }
    const _textViews = [];
    points.forEach((p) => {
      const m = textMaker(p.lnglat_GD, p.data, anchor, type);
    points.forEach((p, i) => {
      const m = textMaker({
        position: p.lnglat_GD,
        text: p.data,
        anchor,
        type,
        color: useColor ? colorList[i] : 'white'
      });
      _textViews.push(m);
    });
    // map.add(_textViews);
@@ -320,21 +376,6 @@
    });

    return res;
    // gridViews.forEach((g, i) => {
    //   const data = parseFloat(gridDataDetail[i]);
    //   const { color, nextColor, range, nextRange } =
    //     Legend.getStandardColorAndNext(factorName, data);
    //   const ratio = (data - range) / (nextRange - range);
    //   const _color = getColorBetweenTwoColors(
    //     color.map((v) => v * 255),
    //     nextColor.map((v) => v * 255),
    //     ratio
    //   );
    //   g.setOptions({
    //     fillColor: _color,
    //     fillOpacity: color[3] == 0 ? 0 : 0.7
    //   });
    // });
  },

  drawGridColorCustom(gridViews, gridDataDetail, opacity) {
@@ -375,21 +416,5 @@
    });

    return res;
    // gridViews.forEach((g, i) => {
    //   const data = parseFloat(gridDataDetail[i]);
    //   const { color, nextColor, range, nextRange } =
    //     Legend.getCustomColorAndNext(data, min, max);
    //   const ratio = (data - range) / (nextRange - range);

    //   const _color = getColorBetweenTwoColors(
    //     color.map((v) => v * 255),
    //     nextColor.map((v) => v * 255),
    //     ratio
    //   );
    //   g.setOptions({
    //     fillColor: _color,
    //     fillOpacity: color[3] == 0 ? 0 : 0.7
    //   });
    // });
  }
};