이미지를 잘라내기 영역 내에서만 표시(cropper-js)
cropper-js(fenyuanchen제)를 사용한 이미지 크롭 도구를 만들고 있습니다.훌륭한 도구이며, 모든 것이 완벽하게 동작합니다.단, 한 가지를 제외하고, 설정에서 뭔가 빠뜨리지 않았는지 잘 모르겠습니다.
사용자는 (이동 가능한 자르기 영역이 아닌) 이미지를 이동할 수 있어야 합니다.자르기 영역은 응답 사각형이며 이미지는 자르기 영역 내에서만 표시되어야 합니다.이제 이미지가 잘라내기 영역 내부와 외부에 표시됩니다.가장자리를 제거하고 싶습니다(이미지가 세로 모드일 경우 가장자리가 위쪽/아래쪽에 있습니다).
예:
현재 사용하고 있는 설정은 다음과 같습니다.
drag-mode = move
guides = false
view-mode = 1
background = false
autoCropArea = 1
cropBoxMovable = false
cropBoxResizable = false
modal = false (with the image examples I turned this to true for a better view of the issue)
center = false
highlight = false
aspectRatio = 1
가장자리를 css(클래스 크롭 캔버스)로 숨길 수 있지만, 양쪽에 여백이 남고 세로 이미지에서는 이 여백이 위아래에 있습니다.
누가 이 일을 도와줄 수 있나요?
언급URL : https://stackoverflow.com/questions/57377758/show-image-only-inside-cropping-area-cropper-js
'programing' 카테고리의 다른 글
| Quasar-Framework를 사용하여 상단 메뉴 모음을 작성하는 방법 (0) | 2022.08.28 |
|---|---|
| 모든 데이터를 vuex 또는 redux에 저장하는 것이 좋습니까? (0) | 2022.08.28 |
| vuejs-datepicker의 너비 및 높이를 변경할 수 없습니다. (0) | 2022.08.28 |
| 부동 소수점 숫자의 기호, 가수 및 지수를 얻는 방법 (0) | 2022.08.28 |
| Vuex는 개발 도구를 통해 수동으로 커밋될 때까지 변경을 커밋하지 않습니다. (0) | 2022.08.28 |