1

screenshot of cropbox inside rotated image알고리즘 - 당신이 회전하고 이미지를자를 수있는 이미지 편집기 프로젝트, 일하고

회전 된 사각형 안에 사각형의 탐지를 기록했다.

현재 내가 직면하고있는 문제는 이미지를 회전하면 회전 된 이미지의 경계 안에 자르기 상자를 드래그 할 수 있기를 바랍니다. 지금까지 나는 Liang-BarskyCohen-Sutherland 라인 클리핑 알고리즘과 Separating Axis Theorem을보고 있었지만 사용 사례에 어떻게 구현할 수 있는지 보려합니다.

누구나 올바른 방향으로 나를 가리킬 수 있습니까? 내가 틀린 나무를 짖고 있니?

+2

확인을 내부 사각형의 네 모서리가 바깥 쪽 사각형 안에있는 경우. – alain

+0

순진한 방법은 작은 직사각형의 각 선분을 검사하여 큰 직사각형의 모든 선분과 교차하는지 확인하는 것입니다. 회전 된 사각형에 대한 포인트가 있습니다 (회전 각도를 알고 있다고 가정). 16 라인 교차 테스트에 불과합니다. 최적은 아니지만 시작일뿐입니다. 선택 사각형의 왼쪽면이 회전 된 사각형의 오른쪽면과 교차 할 수 없기 때문에 몇 가지 가정을 할 수 있다면 테스트의 수를 줄일 수 있습니다. –

답변

2

Alain의 의견을 사용하십시오. 모서리의 내재 성을 검사하려면 모서리가 축 정렬되도록 이미지를 반대 방향으로 회전하면 충분합니다. 그렇다면 축에서 쉽게 정렬 할 수있는 포인트 문제가 있습니다.

enter image description here

은 (난 당신이 정말 이미지, 단지 형상을 회전한다는 것을 의미하지 않는다.)

+0

덕분에,이 독창적 인 :) 약간 더 집중 카운터 - 회전 작업을 마우스를 아래로 만들 수 있습니다, 다음 마우스 이동에 그냥 모든 4 코너가 상자에 있는지 확인할 수 있습니다. 큰! – daviestar

+0

집중? 무슨 소리 야?이것은 0.1 마이크로 초 미만이어야합니다. –

+0

javascript의 원시 trig 함수가 느려서 대답이 전략적으로 (mousedown에서) 캐시되고 60fps (mousemove에서)로 실행되지 않는 것이 좋습니다. 모든 것이 브라우저에서 조금 도움이됩니다! – daviestar

0

사용자가 시도하려는 동작이 [dx, dy] 인 경우 선택 영역의 모서리에서 [dx, dy]로 번역 된 점 (아래 예의 노란색 선)을 고려하십시오. 이 선은 특정 지점 (빨간색 점)에서 회전 된 이미지 경계 (녹색 선)와 교차 할 수 있습니다. 교차로가 없으면 움직임이 합법적입니다. 하나 이상의 교차로가있는 경우 이동이 합법적 인 지점까지 알려줍니다. 원래 위치에 가장 가까운 교차점 (수평 또는 수직 거리를 확인하는 것으로 충분 함)이 최대 이동 (이 예에서 오른쪽 하단 모서리)을 결정합니다. 그런 다음이 지점으로 번역을 제한 할 수 있습니다. 에 따라

translation of rectangular selection

의 이동 방향은 사용자가 하나의 코너 (예에서는, 왼쪽 아래)를 검사 건너 뛸 수 (이 예에서는 상부 우측 방향)에 사분면; 다른 구석들은 항상 경계선 안으로 부딪 칠 것입니다.
움직임의 방향과 이미지의 회전 각도를 비교하여 두 경계 (이 예의 경우 왼쪽 및 아래쪽)를 확인하지 않고 건너 뛸 수 있습니다.
그래서 3 개의 선분과 2 개의 선분이 교차하는지 확인해야합니다. 선분 교차 코드는 예 : this question.

사용자가 한 면만 드래그하고 이동하는 대신 사각형을 확장하는 경우 움직이는 두 모서리 만 확인하면됩니다.

+0

@ daviestar 마지막 ​​법적인 입장을 알고 있으면 유용하다고 생각하지 않습니까? 아니면 Yves의 답변에 비해 불필요하게 복잡하다고 생각하는 것입니까? – m69

관련 문제