根据经纬度点绘制矩形，并统计该矩形中经纬度点的个数（矩形不重叠）

需求描述：无人机飞行时标点回传，根据回传的经纬度点绘制不重复的方格，并统计每个方格中经纬度点的数量

实现思路：根据第一个传入的点建立xy坐标系，第一个传入的点作为xy坐标系中心点，设置x与y坐标轴刻度距离d，将坐标系分为以d为宽度/高度的网格状，建系完成后，循环判断新点位于坐标系哪个网格，得到该网格四个顶点渲染颜色

若某个点超出所建立坐标系范围，则扩建坐标系

中心代码：

//传入首个坐标位置(传入中心点位置) x和y坐标轴刻度数 x和y刻度公差
const createCoordinateSystem = (centerPoint, rangeNum, d) => {
  let oPoint = centerPoint - (rangeNum / 2) * d; //计算原点的x坐标
  let arr = []; //生成x轴数组
  for (let i = 0; i < rangeNum; i++) {
    let Item = oPoint + d * i;
    arr.push(Item);
  }
  return arr;
};
//判断新点区间
const judgePoint = (point, xArr, yArr, d) => {
  if (
    point[0] < xArr[0] ||
    point[0] >= xArr[xArr.length] ||
    point[1] < yArr[0] ||
    point[1] >= yArr[yArr.length]
  ) {
    count++
  } else {
    //计算新点的x或y坐标区间
    let boxXRange = getTargetRange(point[0], xArr, d);
    let boxYRange = getTargetRange(point[1], yArr, d);
    return [boxXRange, boxYRange];
  }
};
const getTargetRange = (pointXorY, arr, d) => {
  let targetRange = [];
  arr.forEach((item, index) => {
    if (item <= pointXorY && item + d > pointXorY) {
      targetRange[0] = item;
      targetRange[1] = item + d;
    }
  });
  return targetRange;
};
//扩建坐标系
const expandCoordinateSystem = (point, d, xArr,yArr,rangeNum,count) => {
  //新点大于x轴最大值&&大于y轴最小值，坐标轴以（xmax，ymax）为中心点重建
  if (point[0] >= xArr[xArr.length] && point[1] > yArr[0]) {
    createCoordinateSystem([xArr[xArr.length],yArr[yArr.length]],rangeNum*count,d)
    //新点小于x轴最大值，大于y轴最大值，坐标轴以（xmin，ymax）为中心点重建
  } else if (point[0] < xArr[xArr.length] && point[1]>yArr[yArr.length]) {
     createCoordinateSystem([xArr[0],yArr[yArr.length]],rangeNum*count,d)
    //新点小于x轴最小值，小于y轴最大值，坐标轴以（xmin，ymin）为中心点重建
  } else if (point[0] < xArr[0] && point[1] < yArr[yArr.length]) {
     createCoordinateSystem([xArr[0],yArr[0]],rangeNum*count,d)
    //新点大于x轴最小值，小于y轴最小值，坐标轴以（xmax，ymin）为中心点重建
  }else if(point[0] > xArr[0] && point[1] < yArr[0]){
     createCoordinateSystem([xArr[xArr.length],yArr[0]],rangeNum*count,d)
  }
};


let firstPoint = [2000, 5000];//模拟第一个传入的经纬度点
let rangeNum = 200; //设置预期刻度为200个
let d = 10; //设置预期公差10
let count=1//建坐标系次数
let xArr = createCoordinateSystem(firstPoint[0], rangeNum, d);
let yArr = createCoordinateSystem(firstPoint[1], rangeNum, d);
console.log("坐标系x轴", xArr);
console.log("坐标系y轴", yArr);
let point = [2301, 5801];//模拟第二个传入的经纬度点
let targetBoxRange = judgePoint(point, xArr, yArr, d);//得到第二个经纬度点所处网格的坐标
console.log(targetBoxRange);

以上代码仅实现中心思路，具体实施还需根据项目改写，感谢您的查看~