0x00 Preface
最近在開(kāi)發(fā)一個(gè)2D組態(tài)圖形組件的過(guò)程中，里面的數(shù)學(xué)模塊，涉及到兩個(gè)矩形是否相交的判斷。
這個(gè)問(wèn)題很多年前就寫(xiě)過(guò)，算是個(gè)小的算法吧。
網(wǎng)絡(luò)上搜索一下，有很多思路，有一些思路要基于多種組合的判斷，顯得比較復(fù)雜。 比如兩個(gè)矩形相交的情形，可能有下面的多種類型：
而每種類型又有多種子類型。
0x01 Body
其實(shí)可以反向來(lái)思考這個(gè)問(wèn)題，就比較簡(jiǎn)單，兩個(gè)矩形A和B，不相交的情況有哪些，然后通過(guò)bool 取反，就是相交的情況。
假設(shè)矩形的的定義如下：
class Rect {
constructor(x,y,w,h) {
this.x = x;
this.y = y;
this.w = w;
this.h = h;
this.r = x + w; // r表示矩形的右邊
this.b = y + h; // b 表示矩形的下邊
}
}
不相交的情況可以歸納為這幾種情況：
- A在B的左邊 （A.r < B.x）
- A在B的右邊 ( B.r < A.x)
- A在B的上邊 （A.b < B.y ）
- A在B的下邊 （B.b < A.y ）
所以不相交的代碼如下：
A.r < B.x || B.r < A.x || A.b < B.y || B.b <A.y
對(duì)于這種情況取反，就是相交的情況：
!(A.r < B.x || B.r < A.x || A.b < B.y || B.b <A.y)
取反之后 或變與：
A.r >= B.x && B.r >= A.x && A.b >= B.y && B.b >= A.y
嘗試著問(wèn)下ChatGPT，它給出的正是這種思路，如下圖：
文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-475537.html
0x02 Conclusion
- 有時(shí)候反過(guò)來(lái)思考問(wèn)題，是一種很好的思路
- ChatGPT 牛逼。
0x03 The Last
最后，關(guān)注公號(hào)“ITMan彪叔” 可以添加作者微信進(jìn)行交流，及時(shí)收到更多有價(jià)值的文章。文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-475537.html
到了這里，關(guān)于判斷兩個(gè)矩形是否相交(Rect Intersection)的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
