Skip to content

Commit 8ca163b

Browse files
authored
docs: Translate to korean (#1078)
* docs: translate landing page to Korean * docs: translate guide to Korean * docs: translate api to Korean
1 parent 197367f commit 8ca163b

File tree

3 files changed

+631
-0
lines changed

3 files changed

+631
-0
lines changed

โ€Žwebsite/src/kr/api/index.md

+130
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,130 @@
1+
# ์ฝ”๋”ฉ ๋ ˆํผ๋Ÿฐ์Šค
2+
3+
## Props
4+
5+
`vue-chartjs`๊ฐ€ ์ œ๊ณตํ•˜๋Š” ์ปดํฌ๋„ŒํŠธ๋“ค์€ ๋ช‡ ๊ฐ€์ง€ ๊ธฐ๋ณธ์ ์ธ ์†์„ฑ๋“ค์„ ์ •์˜ํ•œ๋‹ค. `ํ™•์žฅ`ํ•˜๊ณ  ์žˆ๊ธฐ ๋•Œ๋ฌธ์—, ๊ทธ๋“ค์€ * ๋ณด์ด์ง€ ์•Š๋Š” *์ด์ง€๋งŒ, ๊ทธ ๊ฐ’์„ ๋ฎ์–ด ์“ธ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค :
6+
7+
| Prop ์ด๋ฆ„ | ์„ค๋ช… |
8+
|---|---|
9+
| width | ์ฐจํŠธ ํญ |
10+
| height | ์ฐจํŠธ ๋†’์ด |
11+
| chart-id | canvas ์š”์†Œ์˜ id |
12+
| css-classes | ๋‘˜๋Ÿฌ์‹ธ๋Š” div css ํด๋ž˜์Šค (๋ฌธ์ž์—ด) |
13+
| styles | ๋‘˜๋Ÿฌ์‹ธ๋Š” div ์˜ css ํด๋ž˜์Šค (๊ฐ์ฒด) |
14+
| plugins | chartjs ํ”Œ๋Ÿฌ๊ทธ์ธ (๋ฐฐ์—ด) |
15+
16+
## Events
17+
18+
`reactData` ๋˜๋Š” `reactProp` ๋ฏน์Šค ์ธ์ด ์‚ฌ์šฉ๋˜๋ฉด ๋‹ค์Œ ์ด๋ฒคํŠธ๊ฐ€ ๋ฐœํ–‰๋ฉ๋‹ˆ๋‹ค.
19+
20+
| ์ด๋ฒคํŠธ ์ด๋ฆ„ | ์„ค๋ช… |
21+
|---|---|
22+
| `chart:render` | ๋ฏน์Šค ์ธ์ด ์™„์ „ํžˆ ๋ Œ๋”๋ง ๋  ๋•Œ |
23+
| `chart:destroy` | ๋ฏน์Šค์ธ์ด ์ฐจํŠธ ์˜ค๋ธŒ์ ํŠธ ์ธ์Šคํ„ด์Šค๋ฅผ ์‚ญ์ œํ•  ๋•Œ |
24+
| `chart:update` | ๋ฏน์Šค ์ธ์ด ๋‹ค์‹œ ๋ Œ๋”๋ง ๋Œ€์‹  ์—…๋ฐ์ดํŠธ๋ฅผ ํ•  ๋•Œ |
25+
| `labels:update` | labels๊ฐ€ ์„ค์ •๋˜๋ฉด |
26+
| `xlabels:update` | xlabels๊ฐ€ ์„ค์ •๋˜๋ฉด |
27+
| `ylabels:update` | ylabels๊ฐ€ ์„ค์ •๋˜๋ฉด |
28+
29+
## Global Methods
30+
์ „์—ญ ๋ฉ”์†Œ๋“œ๋Š” ๊ฐ€์ ธ์˜ค๊ณ  ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค.
31+
32+
### generateChart
33+
34+
- **Type:** `Function`
35+
- **Arguments**: `chart-id`, `chart-type`
36+
- **Usage:**
37+
38+
```js
39+
import { generateChart } from 'vue-chartjs'
40+
// First argument is the chart-id, second the chart type.
41+
const CustomLine = generateChart('custom-line', 'LineWithLine')
42+
```
43+
44+
## Instance Methods
45+
46+
์ธ์Šคํ„ด์Šค ๋ฉ”์†Œ๋“œ๋Š” ๋…์ž์ ์ธ ์ฐจํŠธ ์ปดํผ๋„ŒํŠธ๋‚ด์—์„œ ์‚ฌ์šฉํ•  ์ˆ˜๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค.
47+
48+
49+
### generateLegend()
50+
51+
HTML ๋ฒ”๋ก€๋ฅผ ๋งŒ๋“œ๋Š” ๋„์šฐ๋ฏธ ํ•จ์ˆ˜
52+
53+
- **Type:** `Function`
54+
- **Arguments**: `none`
55+
- **Usage:**
56+
57+
```js{11}
58+
import { Line } from 'vue-chartjs'
59+
60+
export default {
61+
extends: Line,
62+
props: ['datasets', 'options']
63+
data: () => ({
64+
htmlLegend: null
65+
})
66+
mounted () {
67+
this.renderChart(this.datasets, this.options)
68+
this.htmlLegend = this.generateLegend()
69+
}
70+
}
71+
72+
```
73+
74+
### ํ”Œ๋Ÿฌ๊ทธ์ธ ์ถ”๊ฐ€
75+
76+
Chart.js์—์„œ๋Š” ๊ธ€๋กœ๋ฒŒ ํ”Œ๋Ÿฌ๊ทธ์ธ๊ณผ ์ธ๋ผ์ธ ํ”Œ๋Ÿฌ๊ทธ์ธ์„ ์ •์˜ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ๊ธ€๋กœ๋ฒŒ ํ”Œ๋Ÿฌ๊ทธ์ธ์€ [Chart.js docs] (http://www.chartjs.org/docs/latest/developers/plugins.html)์—์„œ ์„ค๋ช…ํ•œ๋Œ€๋กœ 'vue-chartjs'์—์„œ๋„ ์ž˜ ์ž‘๋™ํ•ฉ๋‹ˆ๋‹ค. .
77+
78+
79+
์ธ๋ผ์ธ ํ”Œ๋Ÿฌ๊ทธ์ธ์„ ์ถ”๊ฐ€ํ•˜๋ ค๋Š” ๊ฒฝ์šฐ๋ฅผ ๋Œ€๋น„ํ•˜์—ฌ `vue-chartjs`๋Š” `addPlugin()`์ด๋ผ๋Š” ํ—ฌํผ ๋ฉ”์†Œ๋“œ๋ฅผ ๋…ธ์ถœํ•ฉ๋‹ˆ๋‹ค.
80+
81+
`renderChart()` ๋ฉ”์†Œ๋“œ ์•ž์— `addPlugin()` ์„ ํ˜ธ์ถœํ•ด์•ผํ•ฉ๋‹ˆ๋‹ค.
82+
83+
- **Type:** `Function`
84+
- **Arguments**: `Array` of Plugins
85+
- **Usage:**### ํ”Œ๋Ÿฌ๊ทธ์ธ ์ถ”๊ฐ€
86+
87+
```js
88+
mounted () {
89+
this.addPlugin({
90+
id: 'my-plugin',
91+
beforeInit: function (chart) {
92+
....
93+
}
94+
})
95+
}
96+
```
97+
98+
### renderChart()
99+
100+
Chart.js์˜ ์ธ์Šคํ„ด์Šค๋ฅผ ๋งŒ๋“ค๊ณ  ๊ทธ๋ฆฝ๋‹ˆ๋‹ค.
101+
102+
- **Type:** `Function`
103+
- **Arguments**: `Chart Data`, `Chart Options`
104+
- **Usage:**
105+
106+
```js
107+
mounted () {
108+
this.renderChart({
109+
labels: ['January', 'February'],
110+
datasets: [
111+
{
112+
label: 'Data One',
113+
backgroundColor: '#f87979',
114+
data: [40, 20]
115+
}
116+
]},
117+
{
118+
responsive: true
119+
}
120+
)
121+
}
122+
```
123+
124+
## Chart.js ๊ฐ์ฒด
125+
126+
๋…์ž์ ์ธ ์ฐจํŠธ ์ปดํผ๋„ŒํŠธ๋‚ด๋กœ๋ถ€ํ„ฐ Chart.js ์˜ ์˜ค๋ธŒ์ ํŠธ์—๋Š” `this.$data._chart` ๋กœ ์•ก์„ธ์Šค ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
127+
128+
## Canvas
129+
130+
Canvas ์š”์†Œ๋Š” `this.$refs.canvas`๋กœ ์•ก์„ธ์Šค ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

0 commit comments

Comments
ย (0)