p5 hershey js
1.0.0
P5.JS Hershey 벡터 글꼴 라이브러리. (라이브 데모)
허쉬 글꼴은 개발 된 벡터 글꼴 모음입니다. c. 1967 년 해군 무기 실험실에서 Allen Vincent Hershey 박사에 의해 원래 초기 캐소드 광선 튜브 디스플레이에서 벡터를 사용하여 렌더링되도록 설계되었습니다. 글꼴은 공개적으로 이용 가능하며 사용 제한이 거의 없습니다. 벡터 글꼴은 쉽게 스케일링되고 2 차원으로 회전됩니다. 결과적으로 Hershey Fonts는 컴퓨터 그래픽, 컴퓨터 보조 설계 프로그램 및 최근에는 레이저 조각과 같은 컴퓨터 보조 제조 응용 프로그램에서 널리 사용되었습니다. (위키 백과)
이 P5.JS 라이브러리는 브라우저에서 Hershey 글꼴을 렌더링합니다. 사용자가 제공하는 Hershey Fonts와 함께 사용자 정의 문자 매핑을 구문 분석 할 수 있습니다.
| 로마 인 | 고딕 | 그리스 사람 | 다른 |
|---|---|---|---|
COMPLEX | GOTHIC_ENGLISH_TRIPLEX | GREEK_COMPLEX | ITALIC_COMPLEX |
COMPLEX_SMALL | GOTHIC_GERMAN_TRIPLEX | GREEK_COMPLEX_SMALL | ITALIC_COMPLEX_SMALL |
DUPLEX | GOTHIC_ITALIAN_TRIPLEX | GREEK_PLAIN | ITALIC_TRIPLEX |
PLAIN | GREEK_SIMPLEX | SCRIPT_COMPLEX | |
SIMPLEX | SCRIPT_SIMPLEX | ||
TRIPLEX | CYRILLIC_COMPLEX |
HTML에는 라이브러리와 데이터 파일을 포함하십시오.
< script src =" p5.hershey.js " > </ script >
< script src =" p5.hershey.data.js " > </ script > P5 Sketch JavaScript에서 P5.hershey.putText 를 호출하십시오
push ( ) ;
translate ( 100 , 100 ) ;
noFill ( ) ;
stroke ( 0 ) ;
strokeWeight ( 1 ) ;
P5 . hershey . putText ( "Hello World!" ) ;
pop ( ) ; P5 . hershey . putText ( "Hello World!" , {
cmap : FONT_HERSHEY . GOTHIC_GERMAN_TRIPLEX ,
align : "center" ,
noise : 0.5 ,
} ) ;cmap 사용할 문자 매핑을 지정하고 자세한 내용은 지원되는 문자 세트를 참조하십시오.align left , center 또는 right 중 하나 일 수 있습니다.noise 정점에 특수 효과를 추가하는 데 사용될 수 있습니다. noise 다음 데이터 타입 중 하나 일 수 있습니다.noise 숫자 인 경우, 기본 randomGaussian 필터가 적용되어 표준 편차로 noise 사용하여 흔들리는/신경 효과를 제공합니다.noise {x: (x,y)=>(x_offset), y: (x,y)=>(y_offset)} , noise.x 및 noise.y 형식의 객체 인 경우 각 정점에서 호출되며 리턴 값은 각 축의 오프셋으로 사용됩니다.사용자는 자신의 허쉬 글꼴과 매핑을 제공 할 수도 있습니다. 올바르게 포맷 된 허쉬 글꼴을 문자열로 구문 분석하려면 다음을 사용하십시오.
var font_data = P5 . hershey . parseFontString ( " 49 12LXRMRV RNOOPOSQTSTUSUPVO" ) ;유니 코드 진입 점에서 허쉬 글꼴이 사용하는 인덱스로의 매핑도 필요합니다. 인덱스가 동일하면 다음과 같이 간단 할 수 있습니다.
var cmap = ( x ) => ( x ) ; 허쉬 글꼴에서 문자 A , B , C , D 가 2,4,6,8 인치에 매핑되는 더 복잡한 매핑이 있다고 가정 해보십시오.
var cmap = ( x ) => ( [ 2 , 4 , 6 , 8 ] [ x - 65 ] ) ; 마지막으로 글꼴과 P5.hershey.putText 에 대한 매핑을 공급합니다. puttext :
P5 . hershey . putText ( "Hello World!" , {
font : font_data ,
cmap : cmap ,
} ) ;P5.hershey.estimateTextWidth(text, args) args 와 함께 그려 지려면 텍스트의 픽셀에서 너비를 반환합니다.P5.hershey.validateFont(font_data) 글꼴 객체에 모든 유효하지 않은 글리프의 지수를 포함하는 Array 반환합니다. index.html 참조하십시오.
