블로그 이미지
윤영식
Full Stacker, Application Architecter, KnowHow Dispenser and Bike Rider

Publication

Category

Recent Post

'Data Visualization/Vega'에 해당되는 글 1

  1. 2018.10.17 [Vega] Vega, Vega-lite 넌 뭐니
2018. 10. 17. 15:11 Data Visualization/Vega

Vega는 선언적인 차트 생성 라이브러리이다. 좀 더 추상화하고 쉽게 사용할 수 있도록 Vega-lite를 제공한다. C3.js 또는 네이버의 C3.js 확장판인 Billboard.js를 생각하면 된다.




특징


- SVG, Canvas를 지원한다. 

- Javascript코드없이 JSON환경으로 차트를 생성한다. 

- Editor, Recommendation Charting해주는 Voyager등을 제공한다.


테스트: https://vega.github.io/editor/#/ 접속해서 다음 환경값을 넣는다. 


{
"$schema": "https://vega.github.io/schema/vega-lite/v2.json",
"data": {"url": "data/seattle-weather.csv", "format": {"type": "csv"}},
"mark": "bar",
"encoding": {
"x": {"timeUnit": "month", "field": "date", "type": "ordinal"},
"y": {"aggregate": "mean", "field": "precipitation", "type": "quantitative"}
},
"config": {"axisY": {"minExtent": 30}}
}





개념 


Vega-lite 소개 동영상을 보고 전반적으로 이해하자. 


좀 더 자세한 개념설명





사용예


Elastic Search에서는 Customizing Chart를 만들기 위해 Vega를 기능으로 추가하여 사용할 수도 있다.


Elastic Search에서 Vega 구현 예제 소스

Vega, Vega-lite, 또는 Vega Editor, Vega Voyager등은 Standalone library 형태로 애플리케이션에 포함하여 사용할 수 있다.




posted by 윤영식
prev 1 next