• Stars
    star
    884
  • Rank 51,646 (Top 2 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created about 6 years ago
  • Updated almost 4 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Describing Chinese Characters with Recursive Radical Packing Language (RRPL)

Recursive Radical Packing Language

Recursive Radical Packing Language (RRPL) is a proposal for a method of describing arbitrary Chinese characters concisely while retaining their structural information. Potential fields for usage include font design and machine learning. In RRPL, each Chinese character is described as a short string of numbers, symbols, and references to other characters. Its syntax is inspired by markup languages such as LaTeX, as well as the traditional "米" grids used for calligraphy practice.

5000+ Traditional Chinese Characters and radicals are currently described using this language. You can download a .json file containing all of them (and unicode mapping) here: dist/min-trad.json

Check out Chinese character & radical visualizations made with RRPL here and here.

Syntax

Each Chinese character is described as a combination of components. These components can be other characters or radicals, as well as building blocks, which defines the simplest shapes that make up every component. Combination can be applied recursively to describe ever more complex glyphs.

Below is an overview of this syntax; You can also check out the Interactive Demo to play with it yourself.

Building Blocks

A building block is a string of the alphabet {0, 1, 2, 3, 4, 5, 6, 7, 8}, in which the presence of a number indicates a corresponding stroke to be drawn on a "米" grid:

 1 2 3
  \|/
8 -+- 4
  /|\
 7 6 5

0 indicates that no stroke should be drawn in this block.

Example:

ResultCodeResultCode
48 24578

Packing

Building blocks can be packed horizontally or vertically using the - and | symbols respectively to compose more complex glyphs. These symbols can be chained to pack more than two symbols with equal room.

Example:

ResultCodeResultCode
27-26-26 2468|24578

Grouping

( and ) symbols can be used to group components together so mixed horizontal and vertical packing can happen in the correct order.

Example:

ResultCodeResultCode
(48|37)-(25678|27)-(37|15) (46-68)|(246-268)|(24-28)

Referencing

Other characters and radicals can be referenced directly to build a new character. The parser will dump the contents of the reference glyph directly into the string, similar to C/C++ #include feature. This makes it especially easy to describe the more complicated Chinese characters, as most of them consist of radicals.

Example:

ResultCodeResultCode
廿|468|由|(八) ((車|(山))-(殳))|(手)
((口)-(口))|(甲)|十 (((木)-(缶)-(木))|(冖))|((鬯)-(彡))

Parser

An baseline parser is included in rrpl_parser.js, which powers this Interactive Demo. It can be used with browser-side JavaScript as well as Node.js:

//require the module: (or in html, <script src="./rrpl_parser.js"></script>)
var parser = require('./rrpl_parser.js');

//obtain an abstract syntax tree
var ast = parser.parse("(48|37)-(25678|27)-(37|15)");

//returns line segments (normalized 0.0-1.0) that can be used to render the character
var lines = parser.toLines(parser.toRects(ast));

File Type

RRPL data can be stored in a JSON file, whith the root object mapping unicode characters to their respective description, e.g.

{
  "一":"48",
  "丁":"468|26|27",
  "上":"246|248",
  "不":"(48-45678-48)|(3-26-1)",
  "丕":"不|一",
  "中":"(46-2468-68)|(24-2468-28)",
  "串":"中|中"
}

The references in these files are usually first expanded before rendering is attempted. This can be done in two ways. The first is using parser.preprocess(json_object) in rrpl_parser.js, while the second is using compile.js. More documentation can be found in the header comments of these files.

The JSON files can be further compressed into (and uncompressed from) a binary file around half of the size of the original using compress.js, by using a half byte to encode each symbol in the RRPL alphabet.

Downloads

  • dist/min-trad.json contains RRPL description of 5000+ traditional Chinese characters stored in JSON format.
  • dist/RRPL.ttf contains a True Type Font (ttf) containing 5000+ traditional Chinese characters with glyphs generated by the default parser. Below is a screenshot of the font in macOS TextEdit.app:

Tools

Rendering

  • Generate a preview.html web page containing a rendering of all characters in a RRPL json file:
$node render.js preview path/to/input.json
  • Generate a realtime.html web page where user inputs can be parsed and rendered interactively: (Characters defined in the input file will be available for referencing)
$node render.js realtime path/to/input.json

Exporting

  • Export a folder of SVG (Scalable Vector Graphics) rendering of each character in a RRPL json file:
$node export_glyphs.js path/to/input.json path/to/output/folder 0

Contrary to what render.js generates, these SVG's contains "outlines" of the glyphs instead of simple strokes. More settings such as thickness can be tweaked in the source code of export_glyphs.js; Command-line API will come later.

  • To generate a TTF (True Type) font from the aforementioned SVG's, FontForge's python library can be used for this purpose. (pip install fontforge) An example can be found in tools/forge_font.py.

Applications

Since RRPL reduces all Chinese characters to a short string of numbers, their structure can be learned by sequential models such as Markov chains, RNN's and LSTM's without much difficulty. I've applied RNN (Recurrent Neural Networks) to the language to hallucinate non-existent Chinese characters. Below are some characters generated by training overnight on ~1000 RRPL character descriptions, with the visuals rendered using a pix2pix model. A separate repo for that project will be created soon.

Contributing

rrpl.json contains the latest, work-in-progress version. There're some 5,000 characters in there, but there're over 50,000 Chinese characters in existence! So help is very much appreciated. If you'd like to help with this project, please append new characters to the file and submit a pull request. For more info, contact me by sending an email to lingdonh[at]andrew[dot]cmu[dot]edu.

Below is a rendering of all 5000+ Chinese characters denoted using RRPL so far. Click on the image to enlarge.

More Repositories

1

shan-shui-inf

Procedurally generated Chinese landscape painting.
HTML
5,488
star
2

fishdraw

procedurally generated fish drawings
JavaScript
2,200
star
3

qiji-font

齊伋體 - typeface from Ming Dynasty woodblock printed books
Python
1,296
star
4

wax

A tiny programming language that transpiles to C, C++, Java, TypeScript, Python, C#, Swift, Lua and WebAssembly 🚀
C
770
star
5

linedraw

Convert images to vectorized line drawings for plotters.
Python
755
star
6

q5xjs

A small and fast alternative (experimental) implementation of p5.js
JavaScript
541
star
7

nonflowers

Procedurally generated paintings of nonexistent flowers.
JavaScript
509
star
8

skeleton-tracing

A new algorithm for retrieving topological skeleton as a set of polylines from binary images
C
497
star
9

cope

A modern IDE for writing classical Chinese poetry 格律诗编辑程序
JavaScript
455
star
10

ndwfc

🌊💥 N-dimensional Wave Function Collapse with infinite canvas
JavaScript
311
star
11

psvg

Programmable Scalable Vector Graphics -- drawings that draw themselves
TypeScript
297
star
12

legumes

🎼 A sheet music to polylines renderer
TypeScript
230
star
13

magic-square-poems

Discovering magic squares in Tang Dynasty poems
C
188
star
14

handpose-facemesh-demos

🎥🤟 8 minimalistic templates for tfjs mediapipe handpose and facemesh
JavaScript
187
star
15

Hermit

A man. A horse. A nature.
Python
168
star
16

chinese-hershey-font

Convert Chinese Characters to Single-Line Fonts using Computer Vision
Python
129
star
17

Processing-Demos-for-The-Pocket-Handbook-of-Image-Processing-Algorithms

Processing Demos made when reading the book *The Pocket Handbook for Image Processing Algorithms in C*
Processing
127
star
18

edges2calligraphy

Using pix2pix to convert scribbles to Chinese calligraphy
JavaScript
115
star
19

tk-fangsong-font

剔骨仿宋: Experimental Fang Song style Chinese font
Python
112
star
20

grand-timeline

Interactive grand unified timeline of 30,800 ancient Chinese people / 古人全表
JavaScript
111
star
21

hfmath

Render LaTeX math with Hershey Fonts
TypeScript
94
star
22

VisionOSC

PoseOSC + FaceOSC + HandOSC + OcrOSC + CatOSC + DogOSC
Objective-C++
88
star
23

wechit

WeChat in Terminal (微信终端版)
Python
88
star
24

wasm-fun

Non-trivial programs in hand-written WebAssembly
WebAssembly
78
star
25

PoseOSC

📹🤸‍♂️🤾‍♀️🤺 PoseNet + OSC: send realtime human pose estimation data to your apps
JavaScript
77
star
26

ci-ren

Generative Chinese poetry
Python
75
star
27

r1b

A thermal-printer-oriented, 1-bit graphics rasterizer for 2D and 3D
C
73
star
28

squiggy

vector brushstroke library
TypeScript
65
star
29

asciimare

3D engine powered by ASCII art
Python
63
star
30

Okb.js

Procedural generation toolkit for Javascript - noises, randomness, curves, and more
HTML
60
star
31

ofxPoissonFill

Poisson filling shader for OpenFrameworks
C++
56
star
32

p5-hershey-js

p5.js Hershey Vector Font Library
JavaScript
53
star
33

pmst

🎨 Poor Man's Style Transfer - Painting an image with the style of another, without machine learning
C++
48
star
34

Loshu.js

A linear algebra library for JavaScript 🔢
JavaScript
47
star
35

zdic-cli

An offline command-line interface to zdic.net dictionary (漢典)
JavaScript
47
star
36

interesting-polygon-archive

Collection of polygon data in various formats for testing computational geometry algorithms.
Processing
46
star
37

ttf2hershey

Convert True Type Fonts (.ttf) to Hershey vector fonts
Python
43
star
38

skeletonization-js

Javascript implementation of image skeletonization
JavaScript
42
star
39

t43

A tiny 3D slicer written from scratch
C
32
star
40

fv

An experimental approach to expressing vector math in js (tagged template literals)
JavaScript
31
star
41

LingDong-

Automatically keep my Github profile README updated with a python script and Github Actions
Python
28
star
42

PContour

Processing/Java library for finding contours in binary images
HTML
28
star
43

srcsnap

screenshot-driven version tracking
JavaScript
22
star
44

dbn.js

Recreation of John Maeda's "Design By Numbers" programming environment in JavaScript
JavaScript
18
star
45

wax4vscode

Extension for the wax programming language in VS Code (highlight + transpile + run)
TypeScript
17
star
46

TrackpadOSC

💻👋✌️👉Send mac's multitouch trackpad read-out through OSC
Objective-C
17
star
47

xcessing

Friendly Processing-like interface to X11/Xlib in C
C
16
star
48

svg2pl

convert svg to polylines
C
15
star
49

lbll

tiny experimental language for limited environments
C
14
star
50

fast-many-face-detection-with-cpp-or-openframeworks-on-mac-using-neural-networks

Fast Many Face Detection with C++/OpenFrameworks on macOS using Neural Networks
C++
14
star
51

galiano-drawing

A procedurally generated drawing
JavaScript
11
star
52

machining-projection-map

JavaScript
8
star
53

avrlass

AVR Lightweight Assembler (and disassembler)
JavaScript
6
star
54

60-212

JavaScript
5
star
55

teapot.lua

1 path tracer written in pure lua, 1 file, 0 dependencies.
Lua
5
star
56

Hello-World

Lorem Ipsum
3
star
57

cvDictUI

opencv-python tool for generating interactive GUI from any python dictionary
Python
3
star
58

lingdong

LingDong's project links
JavaScript
2
star
59

galiano-lidar-render

Semi-realistic rendering of LiDAR data from the entire Galiano Island, BC
C
1
star