사이드 프로젝트로 사이트를 하나 만들어 보았습니다.
페이지 정보
본문
공공데이터 포털에 있는 데이터로 뭔가 해 볼 만한게 없을까 항상 생각하다가..
"국회의원 발의 법률안"이란 데이터를 보고는..
국회의원 법안발의 건수를 그래프로 그리면 월급루팡(?)을 찾을 수 있지 않을까?
라는 생각이 들어서....
개발자 평가를 commit 개수로 하는 느낌이랑 비슷해서 살짝 저항감은 있었습니다만.. ㅎㅎ
도구를 물색하다가 Observable Framework 라는 걸 발견했습니다.
data visualization 라이브러리로 유명한 D3.js 만든 곳에서 만든 툴 인데요.
markdown으로 작성하면 static site를 생성 해주는 hugo, jekyll 같은 계열인데,
Observable Framework은 그래프를 포함한 dashboard 형태의 사이트를 생성해 줍니다.
hugo로 블로그도 만들어 봤었고 해서 별로 안 어렵겠지 하고 일단 이걸로 해보기로 하고 시작해 봤습니다.
목표는...
1. 열린국회 API로 데이터를 수집
2. 수집한 데이터를 조합 & 집계해서 json 혹은 csv 형태로 저장.
3. Observable Framework에서 2에서 생성한 json, csv 데이터를 읽어서 그래프로 표시
4. static site니까 따로 서버는 없이 github pages에 배포.
열린국회의 데이터가 정합성이 좀 안맞는 곳들이 있더군요.
(동명이인이 있으면 발의자 특정이 불가능, 공동 발의자가 많으면 API로는 데이터 획득 불가 등등...)
Observable Framework 쪽도 생각보다 러닝커브가 높더군요.
Observable Framework 자체는 그래프다보니 markdown 만으로는 페이지 구성이 어려워서 html 과 js를 섞어서 쓰는 형태인데 framwork 자체는 그리 어렵지는 않았습니다만....
Observable Plot이 라는 라이브러리로 그래프를 그리는데 이게 D3.js를 조금 쓰기 쉽게 wrapping 해둔 것 같은데 D3.js 로 직접 그리는거 보단 쉽게 만들어 둔거겠지만, 생각보다 원하는 모양으로 그리려면 시행착오가 많이 필요했습니다.
backend 없이 json / csv 같은 데이터 파일 기반으로 dashboard 만드는 시나리오가 별로 많지는 않겠습니다만 ㅎㅎ.
그럴 경우에 Observable Framework 꽤 좋은 툴인거 같습니다.
ruinnel님의 댓글의 댓글
아무래도 차트에 힘을 좀 주고 싶었던터라...
이쪽은 차트 쪽이 D3.js 베이스인 observable 보다 조금 약해(?) 보이네요
제가 잘 못 써서 그렇지...
차트쪽이 엄청 강력해 보여서 선택 한거거든요.ㅋㅋ 제 능력부족으로 계륵이 된 감도 있습니다만 ㅜㅡㅜ.
ggang9님의 댓글의 댓글
근세 인터렉션이 많고 성능을 위해서라면 결국에는 d3.js로 가게 되긴 합니다. ㅎㅎ
ruinnel님의 댓글의 댓글
d3 직접 쓰기 엄두 안나서 plot 보고 이거다.. 해서 시작한거긴 한데 이것도 너무 어렵습니다 ㅜㅡㅜ.
원하는 대로 그래프가 안 뽑히네요.
ruinnel님의 댓글의 댓글
정량적 평가 라는 것도 있으니까요 ㅋㅋㅋ
ruinnel님의 댓글의 댓글
근데 이걸 또 뭐에 쓸까하면 쓸곳이 ㅎㅎ 생각 나진 않네요.
plot 만 따로 그래프 그리기에는 쓸거 같아요 ㅎㅎ
규링님의 댓글의 댓글
쓸려고 할 때 모르는 것보단 하나라도 알아둬서 나쁠 건 없죠.
ggang9님의 댓글