WEB/JavaScript

[JS] Fuse.js

JungCw 2024. 12. 12. 11:08

지난 포스트에서 손글씨를 텍스트로 추출하는 과정을 보였다.

최대한 높은 정확도로 손글씨를 텍스트화 하였지만, 여전히 남은 오차를 줄일 방법이 필요했다.

다른 라이브러리나 api 혹은 전처리나 후처리 등이 많이 있겠지만, 일단 서비스의 환경에 포인트를 맞추기로 하였다.

 

다행히도 해당 서비스에는 이미 작성된 유저 리스트가 존재한다.

그 말은 즉, 유사한 텍스트로만 추출해도 비교를 통해 유추해낼 수 있다는 뜻이다.

덕분에 어려운 길로 가지 않고 간단히 처리해볼 수 있었다.

 

흔히 검색 등에 사용되는 fuzzy-search 라이브러리인 Fuse.js를 여기에 적용해 볼 것이다.

fuzzy-search란 간단히 말하면 입력받은 문자(패턴)과 유사한 문자열을 검색하는 '유사 검색'기술이다.

 

일단 설치부터 한다.

npm i fuse.js

 

사용하는 방법은 매우 간단하다.

import Fuse from "fuse.js";

const findSimilarUser = () => {
    const userList = [{ username: "홍길동", age: 20}, ...];
    
    const options = {
    	keys: ["username"],
    };
    
    const fuse = new Fuse(userList, options);
    
    const result = fuse.search(text);
    ...
}

 

검색 옵션을 설정해주고, 검색할 배열과 함께 정의해주면 된다.

마지막 줄의 text부분에 원하는 검색값을 전달해주면 유사 검색이 실행되는 것이다.

 

이제 다만 일반적인 텍스트끼리의 비교가 아닌, 손글씨와의 비교이기 때문에 옵션을 조금 수정해주어야한다.

 

옵션에는 몇가지가 더 존재하지만, 그중에 'threshold'라는 옵션을 수정할 것이다.

 

threshold

  • Type: number
  • Default: 0.6

At what point does the match algorithm give up. A threshold of 0.0 requires a perfect match (of both letters and location), a threshold of 1.0 would match anything.

 

공식 문서에 나와있는 threshold 옵션의 내용이다.

말그대로 문자가 얼마나 유사한지를 기준으로 할 것인지 설정하는 옵션이다.

0에 가까울수록 일치해야하고, 1에 가까울수록 일치하지 않아도 된다.

기본은 0.6이지만 테스트를 통해서 적당한 수준으로 맞추어주어야한다.

 

여기까지 완성하고 나면 결과는 다음과 같다.

 

손글씨 이미지 파일
API OCR 추출 텍스트
Fuse.js 실행 후