javascript - 캔버스 자르기 빈 영역

Question

캔버스를 사용하여 전자 서명을 했는데 사용자가 서명한 후 공간이 너무 많이 남았습니다. 공백을 캡쳐할 수 있는 방법이 있나요? 예시 원본 사진: 서명 과정에서 마우스가 통과한 영역을 얻어 아래와 같이 빨간색 영역의 좌표를 얻었습니다. 그런 다음 img 객체에 전달하고 캔버스에 그립니다.

滿天的星座 · Answer

우선, 1차원 배열인 데이터 속성을 가진 현재 캔버스의 이미지 데이터 개체를 반환합니다. 이 1차원 배열에서 4개의 첨자는 모두 R을 나타냅니다. G, B, A 값의 경우 작성자는 경계를 찾기 위해 이 값만 탐색하면 됩니다. 으아악

世界只因有你 · Answer

왼쪽 상단 모서리와 오른쪽 하단 모서리의 좌표 또는 오른쪽 상단 모서리와 왼쪽 하단 모서리의 좌표를 유지하려면 한 줄씩 스캔하여 ImageData를 통해 픽셀을 스캔합니다.

过去多啦不再A梦 · Answer

으아아아

为情所困 · Answer

단순히 카르바스를 확대하는 것이 귀하의 요구를 충족시킬 수 있는지 모르겠습니다.
원본 포스터는 빨간색 상자에 그림이 있다는 것을 의미하며, 그러면 그림의 너비와 높이를 알 수 있고 이미지와 카르바스를 계산할 수 있습니다. Carvas의 너비와 높이를 기준으로 확대/축소 비율
ctx.scale(widthScale, heightScale) 메서드를 통해 확대 비율을 설정합니다.
그런 다음 ctx가 이미지를 그립니다.

PHP中文网 · Answer

포스터로 문제가 해결되었나요? 지정된 좌표의 직사각형 이미지를 얻으셨나요?