2017-04-26 3 views
6

나는 이모티콘 (이상적으로 애플 이모티콘)에서 이미지 파일을 생성해야하는 프로젝트에 참여하고 있습니다. 나는 그것이 꽤 간단한 것이어야한다고 생각했다. 그러나 내가 사용하는 각각의 도구로, 나는 결국 벽에 부딪쳤다.Node.js의 PNG 또는 JPG에 이모티 - 방법?

나는 필요할 때 쿼리 할 수있는 this one과 같은 그림 이모티콘 작업도 고려했습니다. 불행히도, 제가 링크 한 것은 avocado() shrimp() 나 harambe() 같은 유니 코드 9.0 이모티콘이 없습니다. 그런 최신 세트를 아십니까?

코드 방식으로 opentype.js를 시도했지만 Mac (Apple Color Emoji.ttc)에서 이모티콘 글꼴의 확장자 인 .ttc 글꼴을 지원하지 않습니다. 나는 .TTF 폰트를 변환 한하지만 그 중 하나가 작동하지 않았다 :

var opentype = require('opentype.js'); 
    opentype.load('./build_scripts/apple_color_emoji.ttf', function (err, font) { 
     if (err) { 
      alert('Could not load font: ' + err); 
     } else { 
      console.log("loaded the font",font); 

      var Canvas = require('canvas') 
      , Image = Canvas.Image 
      , canvas = new Canvas(200, 200) 
      , ctx = canvas.getContext('2d'); 
      var path = font.getPath('', 0, 150, 72); 
      path.draw(ctx); 
      console.log('<img src="' + canvas.toDataURL() + '" />'); 
     } 
    }); 

결과는 다음과 같습니다 예정이다

The result looks like this:

내가 해봤 fontkit는 수 .ttc 파일을 읽을 수는 있지만 Apple Color Emoji 글꼴을 사용하려고하면 오류가 발생합니다. 내가 몇 가지 잘못된 SVG와 끝까지 내 변환 된 TTF 파일과 같은 시도 할 경우

var fontkit = require('fontkit'); 
    var font = fontkit.openSync('./build_scripts/Apple Color Emoji.ttc'); 
    // TypeError: font.layout is not a function 

:

var fontkit = require('fontkit'); 
    var font = fontkit.openSync('./build_scripts/apple_color_emoji.ttf'); 
    var run = font.layout(''); 
    var svg = run.glyphs[0].path.toSVG(); 

    console.log(svg); 
    // M-1 0ZM799 800Z 

내 질문은, 난이 올바른 방법으로 접근하고있다? 이미 컴퓨터에서 이모티콘을 .png 또는 다른 형식으로 변환하는 것은 상당히 직설적이어야하는 것처럼 보이지만 작동시키지 못합니다.

편집 : 나는 (rodrigopolo에 큰 shoutouts) this repo 자신의 헥사 코드로 이모티콘 이름의 목록을 발견했습니다

. 이제 간단히 이것을 사용할 수 있습니다 :

var emoji = "".codePointAt(0).toString(16); //1f60a 
var emojiFile = fs.readFileSync('./my-emoji-folder/' + emoji + '.png'); 

누군가가이 문제에 대한 코딩 솔루션을 가지고 있는지를 아는 것이 좋습니다!

멀어져 편집 :

이모티콘을 유니 코드 8.0까지 난 단지 포함 발견 한 최초의 솔루션을 밝혀, 9.0 유니 코드 없습니다. 이모티콘을 추출하는 루비 보석 gemoji을 찾았습니다. 당신은 루비 개발자 (아니에요)하지 않은 경우, 당신은 단순히 당신의 쉘에서 다음 명령을 사용할 수 있습니다

git clone https://github.com/github/gemoji.git 
cd gemoji 
bundle install 
bundle exec gemoji extract some-directory/emoji 

당신은 지금 어떤 디렉토리/이모티콘 폴더에 유니 코드 9.0 이모티콘이!

+0

극도로 난해한 문제 (+1)처럼 보입니다. 호기심에서 왜 정확하게 이모티콘으로 이미지를 만들어야합니까? – Dragomok

+1

하하, 그래, 왜 내가 해결책을 찾는 데 어려움을 겪었을지 모르겠다. 나는 다른 .env 파일로 웹 사이트를 구축하여 웹 사이트의 모양을 바꿀 수있는 반응 프로젝트를 실험하고 있습니다. 내가 favicon을 emoji로 지정했기 때문에 .env에 지정된 이모티콘에 따라 동적으로 생성 할 방법이 필요했습니다.그러나 더 일상적인 사용을 위해서는 아직 지원하지 않는 기기에서 최신 이모티콘을 표시하는 데 사용할 수 있습니다. – user2634633

+1

fontkit이 TTC를 지원하는 사람은 누구입니까? 그것은 절대적으로 그렇게하지 않기 때문입니다. * 실제 * 글꼴 파일에 TTC 패키지를 풀고 대신 이미지 생성에 사용하십시오. 또한 솔루션을 찾은 경우이를 "편집"으로 추가하지 말고 대답을 작성한 다음 나중에 동의하십시오. 답변이없는 질문은 Google 색인 대신 시간을 낭비하게됩니다. –

답변

3

글꼴 모음에서 글꼴을 선택하여 글꼴 키트로이 작업을 수행 할 수있었습니다. 나는 "Apple Color Emoji.ttc"에 포함 된 TTF 중 하나를 사용하여 다른 결과를 얻는 경우를 아직 발견하지 못했습니다.

const fs = require('fs'); 
const fontkit = require('fontkit'); 
const emoji = require('node-emoji'); 
const font = fontkit.openSync('./Apple Color Emoji.ttc').fonts[0]; 

let emo = emoji.get('100'); 
let run = font.layout(emo); 
let glyph = run.glyphs[0].getImageForSize(128) 

fs.writeFileSync('100.png', glyph.data); 
+0

정확히 내가 무엇을 찾고 있었습니까! 간단히하기 위해'node-emoji' 의존성을 제거했습니다 :'let run = font.layout ('');'. – user2634633

+0

또한 getImageForSize 함수가 픽셀 단위로 이모티콘 이미지를 가져오고 Apple Color Emoji의 최대 크기가 160 인 것처럼 보입니다. – thebenmiller

관련 문제