jQuery-圖片上傳裁剪外掛程式--imgAreaSelect(分析三) 如何獲得選擇域的映像資訊

還是先來分析一下：

（以下的值，如何獲得，以後在具體的實現中再來分析，現在只談宏觀的）

如何獲得選擇域的映像資訊?  其實就是要我們如何獲得這個選擇地區，在映像中的那個位置，並且這個地區的大小是多少？

把位置和大小告訴了電腦，它就知道我們是要擷取那一塊的映像資訊了。

（我們的選擇地區，是在一個平面當中，而且是一個規則的圖形，正方形，或都矩形（通俗：長方形））

大小：

這個地區的寬度，高度值，兩值相乘，就是這個地區的面積，即大小。（這個應該不難）

位置：

1.假設我們只告訴電腦,這個選擇地區一個[起始點的座標值],而且也告訴電腦這個地區的[面積]那麼符合這兩個條件情況有四：

“紅色”為選擇地區的起始點座標；

A、B、C、D、為 以紅色為起始點，畫出的選擇地區（每個地區的面積是相同的，起始點座標也相同，卻可以出來四種情況）；

 


 

1.假設我們告訴電腦,這個選擇地區兩個座標值,也告訴電腦地區面積：

　　“紅色”為選擇地區的起始點座標，

     “藍色”為選擇地區的橫向結束點座標值

　　"綠色"為選擇地區的面積；

要同時滿足這三個條件，只可能有一種情況

 


 

所以得出，我們要獲得這個映像地區資訊，就需要得到

以上三個值:兩點座標值，和一個面積值

$('#x1').val(selection.x1);
$('#y1').val(selection.y1);
$('#x2').val(selection.x2);
$('#y2').val(selection.y2);
$('#w').val(selection.width);
$('#h').val(selection.height);

 

摘自 船長op