Language/nvd3.js

nvd3.js - 기본적인 Data Format

TechNote.kr 2016. 8. 9. 23:52
728x90

nvd3.js 에서 지원하는 그래프를 위해서 data는 json으로 표현된다.


이를 위한 기본적인 json format은 다음과 같다.


[
 {
    key: "Series name1",
    color: "CSS color",
    values: [
        {x: 0, y: 10},
        {x: 1, y: 20},
        {x: 2, y: 30}
        ....
    ]
 },
 {
    key: "Series name2"
    ...
 }
]


key :

 key는 그래프의 이름이다. 예를 들어 사과의 수확량, 배의 수확량을 표현하는 그래프가 있다고 한다면 이는 서로 다른 그래프로 표현될 수 있고, 이 때 이 두 각기 다른 그래프는 서로 다른 key로 표현된다.


color:

 그래프의 색을 정의할 수 있다. 예를 들어 color: "#ff7f0e" 와 같이 표현 가능하다.


values:

 실제 그래프의 X축과 Y축에 들어갈 값을 포함하고 있는 부분이다. 

728x90