사용자가 업로드한 사진을 처리하려면 캔버스를 사용해야 합니다. 사용자가 업로드한 크기가 매우 클 수 있습니다. 예를 들어 현재 브라우저 창의 너비와 높이를 초과하므로 표시되는 크기에 비례하여 크기를 조정합니다. 그런 다음 캔버스에 그리는데 이는 사용자의 그림을 줄이는 것과 같습니다. 캔버스를 처리한 후 처리된 그림을 흐려짐 없이 원래 크기로 복원할 수 있는 방법이 있습니까?
ringa_lee2017-06-10 09:51:16
캔버스의 너비와 높이는 이미지의 원본 크기와 동일하게 설정되지만 스타일은 캔버스를 보이는 영역에 맞게 조정하는 데 사용됩니다. 이렇게 하면 이미지가 압축되지 않습니다
仅有的幸福2017-06-10 09:51:16
초대해주셔서 감사합니다. 답변드리고 싶은데 해보지는 않아서 모르겠네요. 물론 직접 시도해 볼 수도 있지만 어쨌든 시간이 많이 걸리지는 않습니다.
하지만 생각은 바꿀 수 있어요. 왜 이미지를 줄여서 캔버스에 그리려고 하시나요?
최대 너비나 최대 높이 없이 이미지를 보이는 영역에 맞게 크기를 조정할 수는 없나요? 이것은 단지 이미지가 표면에서 축소된 것입니다. 실제로 naturalWidth 및 naturalHeight는 변경되지 않았으므로 확대/축소 복원은 실제로 필요하지 않습니다.
img를 사용하여 브라우저의 보이는 영역 내에 표시할 수 있습니다. 캔버스는 이미지 처리에 사용되지 않습니다. 캔버스에서 처리 중인 이미지를 표시해야 하는 경우 다른 오프스크린 캔버스를 만든 다음 관련 처리의 크기를 비례적으로 조정하고 마지막으로 오프스크린 캔버스를 저장하면 됩니다.
명확하게 했는지 모르겠네요.
