我一直在尋找類似的問題張貼在SO（和其他地方），但他們似乎只處理矩形，我可以在這一點上處理好，或者比我目前可以包裹我的頭更復雜。JavaScript碰撞檢測矩形和一組邊界座標？
我正在通過mousedown事件在屏幕上移動一個精靈，並希望鎖定它移動「越界」。該範圍可能是一些簡單的像這樣的房間：
其中綠色的是可移動的空間，紅色的限制。我最好把它分解成1長的矩形和2個三角形（或者用一組正方形來表示具有鋸齒狀邊緣的三角形），還是有一個基本概念，我應該注意指定「可行走區域」的座標，並驗證用戶總是「在界限內」？
我在JavaScript中編寫了這個代碼，並且非常依賴jQuery。
編輯︰考慮我可能需要有無限的點（如果房間超過4分）我會更好使用類似A *的東西來生成路徑？
嘗試解構你的問題一下。有了這個簡單的形狀，你有一個矩形需要兩個斜率之間的x座標和兩個扁平線之間的y座標。
像這樣的東西應該很好地工作：即斜線
function outOfBounds(point, boundary) {
return point.y > boundary.top
|| point.y < boundary.bottom
|| point.x < boundary.getLeftBoundAt(point.y)
|| point.x > boundary.getRightBoundAt(point.y);
}
召回可以被定義爲MX + B，但在這種情況下，你的斜坡的關係改變爲y座標x座標。無論如何，getLeftBoundAt（）看起來像：
function getLeftBoundAt(y) {
return this.slope * y + this.base;
}
由於該高度沿左右邊緣也變化的事實，你需要一個稍微複雜的解決方案，其中boundary.top被替換爲調用一個函數是這樣的：
function getTopBoundAt(x) {
var segment = this.topSegmentAt(x);
return segment.origin.y + segment.slope * (x - segment.origin.x);
}
簡單十歲上下的另一種可能性，連續允許的領域是，你可以簡單地包括類似於在你的問題中提供的一個低分辨率的地圖，並將x/y座標轉換爲圖像座標阿泰。如果像素在相應的位置點是綠色的，那麼你很好。這可能會非常快，而且實施起來也很簡單。
這是一個黑客？也許，是的......但我認爲這也是一個非常有趣的解決方案。
我認爲這與舊的點擊式冒險遊戲實現的方法類似。這聽起來更像我腦海中的東西。 –
因此，在這方面我發現了一些非常酷的SVG。使用指針事件和嵌入式SVG（* not *通過標籤的SVG）可以檢查座標是否包含「否」區域。當我有這個工作時，我會回覆，如果有其他人絆倒在這。 –
我把YourPalAl的答案標記爲正確的，但我想讓我的最終解決方案成爲別人偶然發現的答案。
我現在使用jQuery SVG（http://keith-wood.name/svg.html）插入SVG多邊形座標，根據需要定義邊界，並在5個像素內檢查對象「下一個目標」公差範圍。如果下一個目的地碰到多邊形，我會停止物體進一步移動。
最常見的解決方案是將零件解構爲三角形，然後進行重疊測試，或者將其渲染爲像素化位圖並進行像素一次比較。
前者稱爲無論是鑲嵌或三角測量多邊形：
http://en.wikipedia.org/wiki/Polygon_triangulation
而且具有比O爲更好的（N^2）受益。有很多算法可以做到這一點，主要是因爲三維引擎需要生成三角形列表，以交給圖形加速器硬件，這些硬件往往需要三倍[x，y]座標的信息。
不幸的是後者是O（n^2），但允許您執行諸如檢查位圖的alpha值等事情，以便圖片中的「清除」（alpha零或某個中斷）的內容不會計數。因此，您可以做一些有趣的事情，例如確定兩個重疊像素是否足夠「碰撞」，從而產生「模糊」的部分alpha位圖。這個例子不包括α，和Android遊戲，但如持有一般：
一些額外的信息可以在這裏找到：
A simple algorithm for polygon intersection
注意：如果你確實想要使用矩形，包括以近似形狀堆疊的一串矩形作爲碰撞的邊界，那麼（完全公開）我提出這是一個jQuery插件。既然你說你靠的jQuery很多：
感謝您的詳細信息！所有這些都是有用的閱讀材料。我也會玩你的jQuery Collision插件。 –
謝謝你，這是非常有幫助的。我唯一擔心的是，當邊界超過4分時，這種邏輯會破壞嗎？即：http://oi52.tinypic.com/2u8i0bb.jpg –
不一定......在第二種情況下，你給了你很好的應用這個基本技巧。但是，您將需要一個boundary.getTopAt（x）來代替不同的高度，而不是boundary.top。通常，您可以使用getSomeBoundAt（x_or_y_here）擴展此技術，以適用於任何凸多邊形。各種getBound（）方法需要擴展以考慮不同的線段，對於第二個圖像，有7個這樣的線段要考慮boundary.getTopBoundAt（）。 – Yourpalal
經過進一步的思考，即使對於第一個示例，也需要使用getTopBoundAt（），因爲頂部y也沿着兩個邊緣變化。我會編輯我的解決方案來反映這一點。 – Yourpalal