[자바스크립트] Node.js - 가상 캔버스 라이브러리 pureimage 사용

Node.js 내에서 HTML canvas처럼 사용할 수 있는 라이브러리를 기록합니다.

 

1. node-canvas : 가장 많이 쓰여지고 있지만 C++로 만들어져, 사용하려면 빌드해야함.

   Termux를 이용한 안드로이드 linux상에서 사용 불가.

 

2. pureimage : 빌드가 필요 없는 HTML canvas 모듈.

 

저는 Termux와 node.js를 좋아하기 때문에 pureimage를 사용하려 합니다.

 

 다음 명령어로 설치

npm install pureimage --save

 

//===node-canvas를 사용한 경우==================================================
const mobilenet = require('@tensorflow-models/mobilenet');
const { createCanvas, loadImage } = require('canvas');
const canvas = createCanvas();
const ctx = canvas.getContext('2d');

async function run(){
    const img = await loadImage("dog.jpg");
    canvas.width = img.width;
    canvas.height = img.height;
    ctx.drawImage(img, 0, 0);
    const model = await mobilenet.load();
    const predict = await model.classify(canvas);
    console.log(predict);
}

run();

//===pureimage를 사용한 경우====================================================
const fs = require("fs");
const Image = require("pureimage");
const mobilenet = require('@tensorflow-models/mobilenet');

async function run() {
    const img = await Image.decodeJPEGFromStream(fs.createReadStream("dog.jpg"));
    const model = await mobilenet.load();
    const predict = await model.classify(img);
    console.log(predict);
}

run();

위 코드는 tensorflow.js 라이브러리를 이용해 mobilenet을 사용한 예제입니다.

가장 좋은건 pureimage는 native dependencies가 없다는 것입니다.

앞으로 이를 활용해 공부해보도록 하겠습니다.

 

* 이 글은 티스토리 카카오계정 연동정책으로 인해 이전 블로그(오코취) 글을 옮겨왔습니다.

[끝].