Reference
Stroke order from KanjiVG: draw it, and find a kanji by drawing it
import { … } from "@johnmorrisdotca/jisho/strokes";
1083.8 kB minified and gzipped, with everything it imports (measured with esbuild)
The stroke order of a kanji: the strokes in the order they are written, each as the SVG path KanjiVG draws it with in a square of
109 by 109, drawn as an SVG that writes itself stroke by stroke, and a search by drawing a kanji that compares the strokes as they were
drawn with these. The strokes are made from KanjiVG (CC BY-SA 3.0) and are in pieces of about 20 kB gzipped, each holding some kanji, which
loadStrokes fetches for the kanji it is asked about and loadAllStrokes for all of them, as a search by drawing needs.
Exports
| Name | Kind | What it is |
|---|---|---|
DrawingMatch | type | What findByDrawing gives for a kanji: the kanji, and how far its strokes are from the drawn ones (0 is the same, and about 0.1 a careful hand). |
findByDrawing | function | The kanji whose strokes are nearest to what was drawn, nearest first. |
loadAllStrokes | function | The strokes of every kanji the table has, about 1.1 MB gzipped in 57 pieces, as a search by drawing needs them. |
loadStrokes | function | The strokes of the kanji in a text, fetched: one piece of about 20 kB gzipped for each place they are in. |
PackedStrokes | type | The table of the strokes as the data file holds it: where it was made from, the release, and for each kanji its paths, apart by "|". |
pathPoints | function | Points along a path: its curves cut into steps straight pieces each. |
Point | type | A point of a drawing or of a stroke: x then y, in the units of whoever drew it. |
STROKE_BOX | constant | The side of the square KanjiVG draws in. |
StrokeOrderOptions | type | How a drawing of the strokes looks and moves. |
strokeOrderSvg | function | The strokes as an SVG, text a page can put in an element or a server can send: each stroke is a path, and with animate each is written in its turn with CSS that the SVG carries, so that it needs no script and works where an <img> does not. |
strokesOf | function | The strokes of a kanji in the order they are written, each as an SVG path. |