Category Axis
์ถ์ ๋ช ๊ฐ์ ๋ฒ์ฃผ(category)๋ก ๋ถํ ํด์ ๊ฐ ๋ฒ์ฃผ์ ์ฐ๊ฒฐ๋ ์๋ฆฌ์ฆ์ ๋ฐ์ดํฐํฌ์ธํธ๋ค์ ๋ฒ์ฃผ ๋ด์ ๋ฐฐ์นํ๋ค.
๊ฐ ์นดํ
๊ณ ๋ฆฌ๋ ๊ฒฉ๋ฆฌ๋์ด ์์ผ๋ฉฐ, ์นดํ
๊ณ ๋ฆฌ ํ๋๊ฐ 1์ ๊ฐ์ ๊ฐ๋๋ค.
๊ธฐ๋ณธ์ ์ผ๋ก ๊ฐ๋ณ ์นดํ
๊ณ ๋ฆฌ์ ๋๋น(๊ฐ๊ฒฉ)๋ ์นดํ
๊ณ ๋ฆฌ๋ค ์ฌ์ด์ ์์๋ ํฌ๊ธฐ(๊ฐ)๋ก๋ ์๋ฌด๋ฐ ์๋ฏธ๊ฐ ์๋ค.
์นดํ
๊ณ ๋ฆฌ ์ค์์ด ์นดํ
๊ณ ๋ฆฌ์ ๊ฐ์ ํด๋นํ๋ ์์น์ด๊ณ ์ถ์ ์ฐ๊ฒฐ๋ ๋ฐ์ดํฐํฌ์ธํธ๋ค์ด ๊ทธ ์์น๋ฅผ ๊ธฐ์ค์ผ๋ก ํ์๋๋ค.
๋ชจ๋ ์นดํ
๊ณ ๋ฆฌ์ ๋๋น๋ ๊ธฐ๋ณธ์ ์ผ๋ก๋ ๋์ผํ์ง๋ง ๊ฐ๋ณ์ ์ผ๋ก ๋ค๋ฅด๊ฒ ํ์ํ ์๋ ์๋ค.
์ฐจํธ ์ค์ ์์ x์ถ์ type์ ์ง์ ํ์ง ์์ผ๋ฉด ์๋ฆฌ์ฆ ์ข
๋ฅ์ ๋ฐ๋ผ ์นดํ
๊ณ ๋ฆฌ ์ถ์ผ๋ก ์๋ ์ค์ ๋๋ค.
'bar', 'circlebar', 'candlestick', 'dumbbell', 'lollipop', 'equazlier', 'waterfall', 'heatmap' ์๋ฆฌ์ฆ๋ค์ด
category x์ถ์ ํ์ ๊ฐ๋ฅํ๋ค. ๋ ์ด์์ ์๋ฆฌ์ฆ๊ฐ ์กด์ฌํ ๋ ์ด ์๋ฆฌ์ฆ๋ค ์ข
๋ฅ๊ฐ ์๋ ๊ฒ์ด ํฌํจ๋์ด ์์ผ๋ฉด 'linear'๋ก ์์ฑ๋๋ค.
๋ฌผ๋ก , ์ถ 'type'์ด ์ค์ ๋๋ฉด ๊ทธ ์ข
๋ฅ๋๋ก ์์ฑ๋๋ค.
์นดํ
๊ณ ๋ฆฌ ์ถ label์๋ ์ซ์ ๋์ ์นดํ
๊ณ ๋ฆฌ๋ฅผ ๋ํํ๋ ์ด๋ฆ์ ํ์ํ ์ ์๋ค.
์ฆ, ์ถ label์ ๋ํ ์ด๋ฆ์ ํ์ํด์ผ ํ๋ ๊ฒฝ์ฐ๋ผ๋ฉด 'linear' ๋์ ์นดํ
๊ณ ๋ฆฌ ์ถ์ ๊ณ ๋ คํด์ผ ํ๋ค.
์ค์
์ถ์ type์ ๋ช
์์ ์ผ๋ก "category"๋ก ์ง์ ํ๊ฑฐ๋,
type์ ์ง์ ํ์ง ์๊ณ , "categories" ๋ฐฐ์ด์ ์ค์ ํด๋ ์นดํ
๊ณ ๋ฆฌ ์ถ์ผ๋ก ์์ฑ๋๋ค.
categories ๋ชฉ๋ก์ ์ง์ ํ์ง ์์ผ๋ฉด, ์ฐ๊ฒฐ๋ ์๋ฆฌ์ฆ๋ค์ data๋ก๋ถํฐ ๋ชฉ๋ก์ ์์ฑํ๋ค.
ํ์ง๋ง, 'categories' ๋ชฉ๋ก์ ์ง์ ํ์ง ์๊ณ ์ถ์ ์ฐ๊ฒฐ๋ ์๋ฆฌ์ฆ๋ค๋ก๋ถํฐ ์นดํ
๊ณ ๋ฆฌ ๋ชฉ๋ก์ ์๋ ์์ฑํ๋ฉด,
์๋ฆฌ์ฆ๋ค์ด ๋ชจ๋ ์ฌ๋ผ์ง๋ ๊ฒฝ์ฐ ์นดํ
๊ณ ๋ฆฌ ๋ชฉ๋ก ์ญ์ ์ฌ๋ผ์ง๋ฏ๋ก,
๊ธฐ๋ํ๋ ์นดํ
๊ณ ๋ฆฌ ๋ชฉ๋ก์ ๊ณ ์ ํ์ํ๋ ค๋ ๊ฒฝ์ฐ 'categories' ๋ชฉ๋ก์ ๋ช
์์ ์ผ๋ก ์ค์ ํ๋ ๊ฒ์ด ์ข๋ค.
์นดํ
๊ณ ๋ฆฌ์ถ ๋ํ 2์ฐจ์ ์ขํ๊ณ์ ์ถ์ด๋ฏ๋ก ์ถ ์์ ๊ฐ์ ๊ฐ์ ธ์ผ ํ๋๋ฐ,
์์ฑ๋ ๋ชฉ๋ก์ ์ฒซ๋ฒ์งธ ์นดํ
๊ณ ๋ฆฌ์ ๊ฐ์ด 0์ด๊ณ ,
์นดํ
๊ณ ๋ฆฌ ์์ญ ์ค๊ฐ ์ง์ ์ด ์นดํ
๊ณ ๋ฆฌ ๊ฐ์ ํ์ ์์น๊ฐ ๋๋ค.
const config = {
xAxis: {
type: 'category',
},
};
const config = {
xAxis: [{
name: 'axis1',
categories: ["์ฑ๋จ์", "์ฉ์ธ์", ...]
}, {
name: 'axis2',
}]
};
์นดํ ๊ณ ๋ฆฌ ์ถ์ ์ฐ๊ฒฐ๋ ์๋ฆฌ์ฆ๋ data ์ค์ ์์ ๋ฐ์ดํฐํฌ์ธํธ๋ง๋ค ์ฐ๊ฒฐํ category๋ฅผ ์ง์ ํ ์ ์๋ค.