pa_font 0.2.7 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/USAGE.md +21 -10
- package/dist/paFont.cjs +339 -442
- package/dist/paFont.cjs.map +1 -1
- package/dist/paFont.js +339 -442
- package/dist/paFont.js.map +1 -1
- package/paFont.d.ts +1 -0
- package/package.json +1 -1
package/USAGE.md
CHANGED
|
@@ -42,15 +42,19 @@ const points = shape.toPoints({ step: 8 });
|
|
|
42
42
|
### 2. 문단을 canvas에 그리고, 필요하면 geometry로 바꾸기
|
|
43
43
|
|
|
44
44
|
```js
|
|
45
|
-
const paragraph = font.paragraph(
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
45
|
+
const paragraph = font.paragraph(
|
|
46
|
+
"첫 번째 문단입니다. 자동 줄바꿈됩니다.\n\n두 번째 문단입니다.",
|
|
47
|
+
{
|
|
48
|
+
x: 40,
|
|
49
|
+
y: 80,
|
|
50
|
+
size: 32,
|
|
51
|
+
lineHeight: 1.4,
|
|
52
|
+
gap: 0.75,
|
|
53
|
+
align: "left",
|
|
54
|
+
wrap: "word",
|
|
55
|
+
padding: { x: 24, y: 20 },
|
|
56
|
+
}
|
|
57
|
+
);
|
|
54
58
|
|
|
55
59
|
paragraph.drawText(ctx, {
|
|
56
60
|
fillStyle: "#111",
|
|
@@ -107,7 +111,7 @@ console.log(metrics.width, metrics.bbox);
|
|
|
107
111
|
- `margin`, `padding`: `24`, `"24 32"`, `[24, 32]`, `{ x: 32, y: 24 }`, `{ top, right, bottom, left }`
|
|
108
112
|
- `width`: 생략하면 `drawText(ctx)` 시 현재 canvas 폭 기준으로 자동 계산
|
|
109
113
|
- `height`: `overflow: "hidden"`과 같이 쓰면 clip/clamp
|
|
110
|
-
- `x`, `y`, `size`, `lineHeight`, `align`
|
|
114
|
+
- `x`, `y`, `size`, `lineHeight`, `gap`, `align`
|
|
111
115
|
|
|
112
116
|
세부 제어 옵션:
|
|
113
117
|
|
|
@@ -128,6 +132,12 @@ console.log(metrics.width, metrics.bbox);
|
|
|
128
132
|
|
|
129
133
|
`wordBreak` / `overflowWrap`를 직접 주면 `wrap`보다 우선합니다.
|
|
130
134
|
|
|
135
|
+
빈 줄 하나 이상은 새 문단으로 처리됩니다.
|
|
136
|
+
|
|
137
|
+
- `gap`: 문단 사이 간격. `lineHeight` 배수이며 기본값은 `0.5`
|
|
138
|
+
- `whiteSpace: "normal"`이면 문단 안 단일 줄바꿈은 공백으로 정리
|
|
139
|
+
- `whiteSpace: "pre-wrap"`이면 문단 안 단일 줄바꿈 유지
|
|
140
|
+
|
|
131
141
|
## paParagraph API
|
|
132
142
|
|
|
133
143
|
`font.paragraph()`는 `paParagraph`를 반환합니다.
|
|
@@ -281,6 +291,7 @@ const paragraph = font.paragraph(text, {
|
|
|
281
291
|
y: 0,
|
|
282
292
|
size: 20,
|
|
283
293
|
lineHeight: 1.6,
|
|
294
|
+
gap: 0.5,
|
|
284
295
|
padding: { x: 32, y: 24 },
|
|
285
296
|
margin: "20 0 0 20",
|
|
286
297
|
wrap: "char",
|