최근에는 재미있는 일을 하기 위해 JS를 사용하고 있는데 사진을 처리해야 합니다. 인터넷에는 다양한 방법을 제공하는 튜토리얼이 많이 있으며 일부 방법은 반드시 작동하지 않을 수도 있습니다. 이 기사에서는 저자가 NodeJS를 사용하여 이미지를 처리하는 방법을 확인한 방법을 공유합니다.
npm i gm
gm은 개발자가 이미지를 처리할 수 있도록 일부 JS API를 제공하는 노드 라이브러리입니다. 그러나 아래의 GraphicsMagick 또는 ImageMagick에 의존합니다. 실제로 gm은 이 두 도구를 호출하기 위한 명령줄입니다.
즉, gm을 설치하는 것 외에도 GraphicsMagick이나 ImageMagick도 설치해야 합니다.
이미지매직저자는 MacOS를 사용하고 있으며 ImageMagick을 직접 설치하기로 결정했습니다.
공식 웹사이트 명령에 따르면 단 한 줄의 코드만 필요합니다(Mac에 Brew를 설치한 경우).
양조 설치 imagemagick --with-webp
--with-webp 매개변수를 소개하겠습니다. 삭제할 수 있지만 webp 형식으로 이미지를 처리하려면 추가해야 합니다.
Brew를 사용하는 것이 더 편리합니다. 환경 변수에 대해 걱정할 필요가 없습니다.
그래픽Magick
물론 ImageMagick을 사용하지 않는다면 GraphicsMagick을 사용할 수 있습니다.
양조 설치 그래픽 매직
처음에는 ImageMagick을 설치하기로 결정했는데, 이 글을 작성할 때 항상 오류가 발생했습니다.
const gm = require('gm');
gm('사진 파일 경로').crop(width, height, 0, 0).resize(width2, height2).quality(quality).write('출력 파일 경로', function (err) {
만약 (오류) {
return console.log(err);
} 또 다른 {
console.log('성공');
}
}); ImageMagick을 사용하려면 위의 작성 방법이 실제로 잘못된 것입니다. ImageMagick 도구를 사용하겠다는 점을 명확하게 지정하여 다음과 같이 작성해야 합니다.
const g = require('gm');
const gm = g.subClass({imageMagick: true});
gm('사진 파일 경로').crop(width, height, 0, 0).resize(width2, height2).quality(quality).write('출력 파일 경로', function (err) {
만약 (오류) {
return console.log(err);
} 또 다른 {
console.log('성공');
}
});참조를 위해 일반적으로 사용되는 gm 기능을 기록하십시오.
참고: gm은 체인으로 호출할 수 있으며 작성하는 것이 매우 재미있습니다. gm(파일 이름)에서 이미지 파일을 읽고 레이어별로 처리한 다음 마지막으로 file.write(파일 이름, 콜백)에 씁니다.
확대 사진
.resize(width, height)
사진 자르기
.crop(width, height, x, y)
사진 회전
.rotate(color, deg)
color는 배경색입니다(도 회전 각도가 90의 배수가 아닌 경우 배경색이 유용합니다. '#ededed' 형식을 사용하세요).