几何算法:矩形碰撞和包含检测算法
大家好,我是前端西瓜哥。今天来讲讲几何算法中,比较经典的算法:矩形碰撞和包含检测算法。
矩形碰撞检测是被广泛使用的算法。
比如在游戏中,为了优化图形碰撞判断效率(复杂不规则图形之间的碰撞算法很复杂),经常会使用到包围盒。
所谓包围盒子是一个矩形,通常正好包围住一个规则或不规则的图形。如果两个图形的包围盒没有发生碰撞,那这两个图形一定不会发生碰撞,因为矩形的碰撞算法很简单,所以能够很好地优化性能。
算法实现
考虑到有些读者对原理不感兴趣,想赶紧找到算法复制粘贴,很急,我这里先直接贴上代码实现。
判断矩形是否碰撞:
function isRectIntersect(rect1, rect2) {return (rect1.x <= rect2.x + rect2.width &&rect1.x + rect1.width >= rect2.x &&rect1.y <= rect2.y + rect2.height &&rect1.y + rect1.height >= rect2.y);
}
判断矩形 1 是否包含矩形 2:
function isRectContain(rect1, rect2) {return (rect1.x <= rect2.x &&rect1.x + rect1.width >= rect2.x + rect2.width &&rect1.y <= rect2.y &&rect1.y + rect1.height >= rect2.y + rect2.height);
}
矩形碰撞检测原理
首先明确矩形的定义。我们用 4 个属性来描述一个矩形,分别为 x、y、width、height,表示矩形的左上角位置和尺寸。
这里用主流的坐标系统表示,以屏幕左上角为原点,x轴正方向向右,y 轴正方形向下。
或者我们可以用 minX、minY、maxX,maxY 来表示:
矩形碰撞,也叫矩形相交。矩形发生碰撞的条件是:两个矩形有重叠的区域。
下图是两个矩形碰撞的一些情况:
先看 x 维度,将两个矩形往 x 轴线上投影,我们得到两条线段。
矩形要相交,首先 x 的范围上就应该有交集,等价于判断两个线段是否有交点。
先看看什么情况下它们 不会相交?答案是:一条线段的右端点在另一条线的的左端点的左侧。
所以相交的逻辑是:
!(rect1.x > rect2.x + rect2.width || rect1.x + rect1.width < rect2.x)
转换一下,就是:
rect1.x <= rect2.x + rect2.width &&
rect1.x + rect1.width >= rect2.x
y 维度同理,为:
rect1.y <= rect2.y + rect2.height &&
rect1.y + rect1.height >= rect2.y
所以最终算法实现为:
function isRectIntersect(rect1: IRect, rect2: IRect) {return (rect1.x <= rect2.x + rect2.width && // minX1 <maxXrect1.x + rect1.width >= rect2.x &&rect1.y <= rect2.y + rect2.height &&rect1.y + rect1.height >= rect2.y);
}
矩形包含原理
思路类似矩形碰撞。
也是判断两条线段的位置关系,rect 1 包含 rect 2,首先在 x 维度上需要满足 rect 2 的两个点都在 rect 1 的 x 范围内。
代码为:
rect1.x <= rect2.x &&
rect1.x + rect1.width >= rect2.x + rect2.width
y 同理,最终代码实现为:
function isRectContain(rect1, rect2) {return (rect1.x <= rect2.x &&rect1.x + rect1.width >= rect2.x + rect2.width &&rect1.y <= rect2.y &&rect1.y + rect1.height >= rect2.y + rect2.height);
}
结尾
矩形算法的碰撞和包含算法,思路是降低维度,分解为判断线段的相交关系。
我是前端西瓜哥,欢迎关注我,学习更多前端知识。
几何算法:矩形碰撞和包含检测算法相关推荐
- 目标检测算法(传统基于深度学习的)
目标检测算法 最近在学目标检测各类算法,主要分为传统的目标检测方法和基于深度学习的目标检测算法,这里记录了一些基本的算法介绍.下图是目标检测算法的发展历程 传统目标检测方法 分三部分:区域选择–> ...
- 一文综述人脸检测算法(附资源)
文章来源:SIGAI 本文共9400字,建议阅读10+分钟. 本文将和大家一起回顾人脸检测算法的整个发展历史. [导读] 人脸检测是目前所有目标检测子方向中被研究的最充分的问题之一,它在安防监控,人证 ...
- 基于深度学习的磁环表面缺陷检测算法
基于深度学习的磁环表面缺陷检测算法 人工智能技术与咨询 来源:< 人工智能与机器人研究> ,作者罗菁等 关键词: 缺陷检测:深度学习:磁环:YOLOv3: 摘要: 在磁环的生产制造过程中, ...
- 目标检测算法横向比较,包括backbone、特征融合、loss、proposal/anchor/heatmap、NMS、正负样本设置等
目标检测算法发展移步:目标检测算法 本文从算法改进的方向,进行横向比较,包括backbone,特征融合.loss.proposal/anchor/heatmap.NMS.正负样本设置等 Referen ...
- 人脸检测:人脸检测算法综述
https://blog.csdn.net/SIGAI_CSDN/article/details/80751476 问题描述 人脸检测的目标是找出图像中所有的人脸对应的位置,算法的输出是人脸外接矩形在 ...
- 论文阅读笔记 | 目标检测算法——SAPD算法
如有错误,恳请指出. 文章目录 1. Introduction 2. Soft Anchor-Point Detector 2.1 Detection Formulation with Anchor ...
- 常见经典目标检测算法
1.目标检测基本概念 1.1 什么是目标检测 目标检测(Object Dectection)的任务是找出图像中所有感兴趣的目标(物体),确定他们的类别和位置. 1.2 目标检测要解决的核心问题 除图像 ...
- 机器学习与人脸识别3:人脸检测算法综述
以下内容转自网络,主要介绍人脸算法的历史: 导言 人脸检测是目前所有目标检测子方向中被研究的最充分的问题之一,它在安防监控,人证比对,人机交互,社交和娱乐等方面有很强的应用价值,也是整个人脸识别算法的 ...
- 自动泊车之停车位检测算法(角点检测/语义分割)
作者丨机器学习AI算法工程 来源丨希骥智能网联汽车 点击进入->3D视觉工坊学习交流群 一.背景介绍 自动泊车大体可分为4个等级: 第1级,APA 自动泊车:驾驶员在车内,随时准备制动,分为雷达 ...
最新文章
- Linux编译器GCC的使用
- Datawhale专访 | 周涛:从窄门进最终走出宽路来
- android教程 - android ui 介绍,多图详解 “Android UI”设计官方教程
- 7月10日云栖精选夜读丨ApsaraCache开源之路,阿里云Redis团队LC3全球顶级开源峰会获CRUG开源社区最具影响力奖...
- jQuery 实例 教程
- list排序方法python_python list 排序的两种方法及实例讲解
- PowerDesigner生成mysql字段comment 注释
- maxcompute 2.0复杂数据类型之array
- python-数据类型-字符串入门-定符串的定义-type函数-iput函数
- 如何监视SQL Server索引的总大小
- list 分页_mybatis一对多分页查询
- tp5组装数据_tp5数据库查询和模型结合使用
- linux定时开关机脚本,linux下实现定时关机
- DB2数据库问题总结
- PDM - Product Data Management(产品数据管理)
- 计算机组成原理简答题第二章
- 指纹机和计算机无法连接,考勤机怎么连接到电脑?考勤机连接电脑之后操作指南!...
- UINO优锘:用悬疑舞台剧的方式打开3D开发工程师的一天
- cmd中为什么看不到python安装成功_cmd中运行python怎么切换目录? 怎么查看python中已安装的包...
- 删除文件夹遇到的 错误ox80070091:目录不是空的错误解决
热门文章
- MySQL中的limit用法详解
- 多语言混合开发之易语言调用python算法
- Android设置锁屏/休眠时长
- windows7python_win7python_win7安装python_win7下安装python - 云+社区 - 腾讯云
- 秒拍5大月榜出炉:首发MCN机构榜,魔力TV15.6亿播放量夺冠!
- git 命令怎么创建新分支?
- 测试 ClownFish、CYQ、Entity Framework、Moon、MySoft、NHibernate、PDF、XCode数据访问组件性能
- 用Docker搭建Drools Workbench Showcase
- mysql join sum_mysql-涉及SUM,LEFT JOIN和GROUP BY的复制
- vue---计算属性2--computed---全选反选demo