JS 计算落在某圆形范围下的点数量

业务描述:
有一堆散点数据,用户绘制一个圆,已知圆心和半径,统计落在该圆形范围下的散点的个数。实现后效果如下图所示:

原理:
已知圆心坐标为{x:x0,y:y0},半径为radius。目标即是统计如下图的绿色点的数量:


步骤如下:
1.先根据该圆心和半径构建该圆的外包围盒,其左下角坐标为:{x:x0-radius,y:y0+radius},右上角坐标为:{x:x0+radius,y:y0-radius}。先循环散点,计算出落在该包围盒内的点数据。
2. 根据落在包围盒内的点数据,循环遍历,求每个散点距离圆心的距离,不大于半径的即是落在该圆心区域的散点,记录其个数即可。

代码说明:

两个工具方法:
//计算距离
    calDistance =(coord1,coord2) => {
        let dis2 = Math.pow((coord2.x - coord1.x),2)+Math.pow((coord2.y - coord1.y),2);
        return dis2;
    }

    //判断点是否在包围盒内
    contains = (minx,miny,maxX,maxY,coord) => {
        if(coord.x >= minx && coord.y >= miny && coord.y <= maxY && coord.x <= maxX) {
            return true;
        } else return false;
    }

主方法:

//查询落在某个圆内的人数
    searchPeopleByPoly = (coord,rad) => {
        //外包围盒的最大、最小坐标
        let maxX = coord.x + rad,minX = coord.x - rad,minY = coord.y - rad,maxY = coord.y + rad;

        let perhapsPeople = [];

        let total = 0;

        //先落在矩形框内的人员点
        let _this = this;
        this.props.peopleList.map((item)=>{
            let pPoint = {
                x:item.locationX,
                y:item.locationY
            }
            //先保留落在包围盒内的点
            if(_this.contains(minX,minY,maxX,maxY,pPoint) === true) {
                perhapsPeople.push(item);
            }
        })

        //计算各点到圆心的距离的平方小于等于半径的平方,提高内部计算速度
        perhapsPeople.map((people) => {
            let pPoint = {
                x:people.locationX,
                y:people.locationY
            }
            if(_this.calDistance(pPoint,coord) <= rad*rad) {
                total++;
            }
        })

        return total;
    }
总结: 关键是第一步,第一步的目的是先排出一些不可能的点,这样在数据量大时,使用calDistance的平方和rad的平方比大小,对计算速度又有明显的提升。
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值