์คํ๋ผ์ธ ์ฐจํธ ์๋ฆฌ์ฆ์ ์ฐ๋ฐ์ ์ธ ๋ฌธ์ ๊ฐ ์์ต๋๋ค. ์๋ฆฌ์ฆ๊ฐ ์๋ชป ๊ทธ๋ ค์ง๊ณ ์์ต๋๋ค. ๋ ๋ ์ง๊ฐ ์ฐจ๋ก๋ก ์์ ๋ ์ ์ด ์์ฒด์ ์ผ๋ก ๋ฐ๋ณต๋๊ฑฐ๋ ์ ์ด ๋ค์ ๋ฐ์ดํฐ ํฌ์ธํธ๋ฅผ ์ง๋์ณ ๋ค์ ํฌ์ธํธ๋ก ์ง์ ํ์ด์ง๋ ๋์ ๋ค๋ก ํ์ด์ง๋ ๊ฒฝ์ฐ๊ฐ ์์ต๋๋ค. ๊ทธ๋ฆฌ๊ธฐ ๋ ผ๋ฆฌ๊ฐ ์๋ชป๋ ๊ฒ ๊ฐ์์. ์ฐจํธ๋ฅผ "์ " ๊ณ์ด๋ก ๋ณ๊ฒฝํ๋ฉด ๋์ ์ฌ๋ฐ๋ฅด๊ฒ ํ์๋ฉ๋๋ค.
์ฐจํธ ์ฝ๋๋ฅผ ์์ ํ์ด์ง์ ๋ณต์ฌํ๋ฉด ๋ด ๋ฌธ์ ๋ฅผ ๋ณผ ์ ์์ต๋๋ค. (http://c3js.org/samples/chart_spline.html)
์ฐจํธ ์ฝ๋ ์:
var ์ฐจํธ = c3.generate({
๋ฐ์ดํฐ: {
x: '๋ ์ง',
์ด: [
['๋ ์ง',744336000000,752112000000,876096000000,882057600000,884304000000,88006069600000,8932032900000,8
['๊ฐ',12.15,11.7,11.75,11.86,11.97,12.05,11.27,12.2,12.34,12.27]
],
์ ํ: '์คํ๋ผ์ธ'
}
});
์คํฌ๋ฆฐ์ท:
๋ฌธ์ #1501์ ์ด ๋ฌธ์ ์ ์ ์ฌํฉ๋๋ค.
d3์ ์ผ๋ถ ๋ฒ๊ทธ๋ก ์ธํด: https://github.com/d3/d3/issues/2348
d3 v4.0์์ ์์ ๋์์ต๋๋ค(๋ณด๊ฐ๊ธฐ๋ ๋ฌ์ฝคํ Catmull-Rom ์คํ๋ผ์ธ ์ถ๊ฐ๋ฅผ ํฌํจํ์ฌ ๋ค์ ์์ฑ๋จ ). ๊ทธ๋ฌ๋ c3์ด ์ธ์ ๋ฐ๋ผ์ก์์ง๋ ์ ์ ์์ต๋๋ค(https://github.com/c3js/c3/issues/1648).
c3.js ๋ฒ์ 0.5.1์์๋ spline: { interpolation: { type: 'monotone' } }
์ต์
์ด ์ด ๋ฌธ์ ๋ฅผ ํด๊ฒฐํฉ๋๋ค.
๊ฐ์ฅ ์ ์ฉํ ๋๊ธ
c3.js ๋ฒ์ 0.5.1์์๋
spline: { interpolation: { type: 'monotone' } }
์ต์ ์ด ์ด ๋ฌธ์ ๋ฅผ ํด๊ฒฐํฉ๋๋ค.์ฐธ์กฐ: https://jsfiddle.net/mkw4h54r/10/