[질문] 자바스크립트로 이미지편집기 만들때 자르는거랑 잘린거를 띄우는거를 별도로ㅠ

[익명(39.123)]

로직으로 분리해서

2개의 함수로 나눠야하는 상황인데

모든 예제들은 다

drawImage()안에 인자 9개를 넣어서

이미지의 특정 부분을 잡는 것과

그 특정 부분을 캔버스에 그리는 것을

하나의 method안에서 다 하더라고요

근데 저한테 필요한건

이미지를 일단 잘라놓고나서

그리고 그 잘린 이미지를 화면에 그릴수있게

2개의 함수로 분리하는게 필요합니다

어떻게 해야되는지 알려주시면 고맙겠습니다

[익명(119.195)]

그럼 drawimage를 쓸게 아니라 클립 이런거 써야할거 같은데

[익명(39.123)]

context.clip()을 쓰고나서 그거를 이미지로 표시되게 만들려면 어떻게 해야되는지 헷갈려요

[익명(39.123)]

clip()을 쓰고나서 그 context를 img 태그 같은 DOM요소로 만들고 그거를 원하는 곳에 append 시키고싶기는 한데ㅠㅠ

[익명(119.195)]

var contx = canvas.getContext("2d"); 이렇게 컨텍스트를 할당한 다음에 contx.clip()으로 원하는 영역 클립.. contx.putImageData() 로 클립된 영역에 이미지 붙이기 아님 말고 ㅎㅎ

[익명(39.123)]

putImageData() 안에 첫번째 인자로 이미지 요소가 들어가야하는데

[익명(119.195)]

https://jsfiddle.net/xqy5jknd/

[익명(211.36)]

감사합니다