웹솔루션개발 22년 노하우! 해피CGI의 모든것

[해피CGI][cgimall] Horizontal Bar Chart Plugin - jQuery Devstratum JQP Graph 본문

웹프로그램밍 자료실/JAVA 자료

[해피CGI][cgimall] Horizontal Bar Chart Plugin - jQuery Devstratum JQP Graph

해피CGI윤실장 2020. 2. 28. 09:07

가로 막대 그래프를 손쉽게 웹페이지에 표시할수 있는 jQuery 플러그인입니다.

다운로드 받은 파일의 압축을 해제하면 생기능
demo/index.html 파일을 웹브라우저로 열어서 보면 데모를 확인하는게 가능합니다.





위 그림은 가장 심플한 예제입니다.



소스코드를 열어보면

위 그림 처럼
제목, 단위, 세부설명문구, 각 그래프의 레이블, 값 정도만 설정하면
첫번째 그림 처럼 화면에 막대 그래피를 생성할수 있는 예제입니다.


몇가지 옵션들을 이용해서,



막대그래프를 위 그림 처럼 줄로 구분해서 나누는게 가능합니다.



한개의 그래프를 위한 예제 소스코드인데,
그래프가 1개일때 보다는 약간 복잡하네요.


또 다른 예제는
막대 그래프를 줄로 구분하는게 아닌 한줄로 구분하는 예제도 있네요.



예제 소스코드에선,
그래프가 2개일 때와 큰 차이는 없어 보이는데요.
각 그래프의 제목과, 색상, 값을 설정하는 코드가 2개에서,
3개로 늘어난 것과, 최대값과, 최대구분값 정도를 추가했는게 확인이 되네요.


웹페이지에
간단하게 막대그래프를 표시해야할때 사용하기가 간편할것 같네요.




홈페이지바로가기

Comments