반응형
1. 하이차트 데모(http://www.highcharts.com/demo/) 웹 페이지에 접속합니다.
① 대메뉴 중 DEMO GALLARY 메뉴의 서브메뉴인 Highcharts Demos 메뉴를 클릭하여 접근합니다.
2. 대메뉴 중 DEMO GALLARY 메뉴의 서브메뉴인 Highcharts Demos 메뉴를 클릭하여 접근합니다.
① 좌측에 있는 리스트가 구현 가능한 그래프/차트의 종류입니다.(bar타입, line타입, pie타입 등 다양합니다.)
② Edit in jsFiddle 버튼을 누르면 그래프가 구현된 소스를 수정할 수 있는 창으로 이동합니다.
3. 좌측에 사용할 수 있는 그래프/차트의 목록입니다. 클릭 시 상세 정보/데모 페이지를 확인할 수 있습니다.
① 참조되어있는 js파일입니다. 저는 구현 시 js파일을 다운로드 받아 웹소스가 저장되어있는 서버에 따로 저장하여
참조하였습니다.
② JAVASCRIPT로 구성된 그래프 구현 소스입니다. 각 수치와 옵션(CSS, title 등..)들이 정의됩니다.
③ 소스 수정 후 Run 버튼을 누르면 변경한 소스가 적용됩니다.
④ 변경한 소스가 적용된 그래프의 결과가 표현됩니다.
하이차트 홈페이지 : http://www.highcharts.com/
반응형
'Language > JavaScript' 카테고리의 다른 글
자바스크립트(javascript) XMLHTTP 크롬에서 오류 발생 (0) | 2013.02.01 |
---|---|
[자바스크립트,javascript] 디버깅(debugging) 방법 (1) | 2013.01.22 |
[자바스크립트,javascript] innerHTML 사용 방법 (2) | 2013.01.22 |
Javascript 아작스(XMLHTTP) (0) | 2013.01.22 |
접속 기기/브라우저 정보 추출(navigator.userAgent) (0) | 2012.12.11 |
자바스크립트(javascript) css 난독화 (0) | 2012.11.22 |
로컬 스토리지(localStorage) (0) | 2012.10.10 |
텍스트 입력란 공백체크 정규식 (0) | 2012.09.25 |
엔터키를 눌렀을경우(onkeydown) 함수 실행 (0) | 2012.09.25 |
자바스크립트(javascript) 파일 확장자 추출하기 (0) | 2012.09.12 |