Timeline 참쉬운 사용법~

2012. 12. 22. 22:57 - 에릭투스

회사 입사후 처음 받은 과제!!

timeline으로 회사의 제품 연혁(?)을 만들어보라는 차장님 말씀에 잠시 멘붕!!

(헉!.. timeline(?)... 그..그게뭐지? 먹는건가?)

 

facebook의 timeline 부터 시작해서 최근 이슈인 timeline!!!

저는 사용하기 쉽게 개발된 프레임웍(?)을 소개합니다! 바로 timeline.verite

 

 

 

 

첫 메인부터 timeline을 보여주기 때문에 설명하지 않아도 모두들 이제 timeline이 무엇인지 아셨으리라 생각하지만, timeline이란 연도,달,시간 별로 데이터를 나열하여, 한눈에 이력(?), 내력을 볼 수 있도록 만든 형태입니다~..

 

그래서 활용도로는, facebook처럼 자신이 올린 글을 마치 자신의 성장기를 보여주는

어린시절 앨범처럼 한눈에 볼수 있다는 장점이 있어요~.

 

그럼 이제 timeline js를 활용해서 아주~~쉽게 활용해 보도록 하겠어요!!

 

 

1.

JSON도 지원하기 때문에, DB로 저장되어 있는 경우 JSON으로 변환해서 쉽게 적용할 수 있겠지만 저의 경우 직접 자료도 만들면서 해야했기 때문에 file formats에서  Google Docs Template를 사용했어요~

(쉽게 말해서 엑셀!!!)

 

 

 

 

2.

"Google Docs Template"를 클릭하면 자신의 계정에서 사용할 건 지 물어보고 진행하면

엑셀형태로 템플릿을 제공해줍니다.

 

 

 

 

3.

열심히 안에 데이터를 작성한 후 File - Publish to the Web을 클릭 후

published data 링크 복사합니다.

 

 

 

4.

링크를 복사하신 후 "Google Spreadsheet..." 텍스트박스(왼쪽 형광펜 칠해놓은곳)에 복붙!!

그러면, 이 똑똑한 녀석이 자동으로 Embed Code를 만들어줍니다!!

그럼 이 iframe으로 감사하게 사용하면 됩니다.. (-_-) (__).....

 

 

ps. 혹시라도, 잘안되시는 부분있다면 답글 달아주세요~

제가 아는 부분에선 최선을 다해 도와드리겠습니다~ ^^

 

 

'Workspace' 카테고리의 다른 글

웹개발 환경 설정(tomcat, eclipse)  (0) 2013.01.11
Polestar EMS Station(UI) 개발 환경설정 매뉴얼  (0) 2013.01.11
[DWR Reverse Ajax] start point Java!!  (0) 2013.01.03
Timeline js  (0) 2012.12.22
신입사원의 첫주를 보내며..  (0) 2012.12.22

다른 카테고리의 글 목록

Workspace 카테고리의 포스트를 톺아봅니다