목록#chart (8)

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

[해피CGI][cgimall] 조직도를 구성할 수 있는 ... Orgchart

Javascript jQuery 를 이용하여 조직도를 만들 수 있습니다. API 안내와 여러가지 버젼으로 제공되지만 ... 저는 jQuery Version 만 사용해 봤습니다. toggle 도 가능해서 데모를 볼때는 괜찮다 생각 했지만 다운로드 받아보니 역시나 바로 실행이 되진 않네요 ^^; 데모파일에서상단에 CSS, JS 경로만 수정해 주시면 됩니다. 를 아래처럼 변경하세요.
웹프로그램밍 자료실/JAVA 자료 2020. 4. 14. 09:10
[해피CGI][cgimall] Horizontal Bar Chart Plugin - jQuery Devstratum JQP Graph

가로 막대 그래프를 손쉽게 웹페이지에 표시할수 있는 jQuery 플러그인입니다. 다운로드 받은 파일의 압축을 해제하면 생기능 demo/index.html 파일을 웹브라우저로 열어서 보면 데모를 확인하는게 가능합니다. 위 그림은 가장 심플한 예제입니다. 소스코드를 열어보면 위 그림 처럼 제목, 단위, 세부설명문구, 각 그래프의 레이블, 값 정도만 설정하면 첫번째 그림 처럼 화면에 막대 그래피를 생성할수 있는 예제입니다. 몇가지 옵션들을 이용해서, 막대그래프를 위 그림 처럼 줄로 구분해서 나누는게 가능합니다. 한개의 그래프를 위한 예제 소스코드인데, 그래프가 1개일때 보다는 약간 복잡하네요. 또 다른 예제는 막대 그래프를 줄로 구분하는게 아닌 한줄로 구분하는 예제도 있네요. 예제 소스코드에선, 그래프가 2개..
웹프로그램밍 자료실/JAVA 자료 2020. 2. 28. 09:07
[해피CGI][cgimall] 통계 및 차트를 쉽게 이용할 수 있는 billboard.js

네이버에서 제작한 MIT 라이센스의 차트 billboard.js 입니다.AreaChart 를 비록하여 타원형 차트, 라인형 차트, 도넛형 차트 등 다양한 차트를 제공해주고API 도 제공하여 다양한 분야에 쉽게 이용할 수 있습니다. billboard.js 로 제공되는 기본형 차트입니다. 색상으로 각각의 데이터를 확인할 수 있는 기본형 차트부터 아래에 소개해드릴 다양한 차트 구조를 확인할 수 있습니다. 위와같은 다양한 목차별 차트를 확인할 수 있습니다. 이용하는 방법은 본 사이트에서 다운로드 받을 수 있는 billboard.js 파일과 billboard.css billboard.min.js billboard.min.css insight.css insight.min.css 를 다운받아 상단에 선언한 이후 를 ..
웹프로그램밍 자료실/JAVA 자료 2020. 2. 7. 09:07
[해피CGI][cgimall] jQuery 와 부트스트랩을 이용한 사이클 차트

jQuery 와 Bootstrap 을 이용한 Circle 차트 입니다. 코드는 심플하네요. 라이센스는 MIT License (MIT) 입니다. 기본 적으로 사용된 옵션들 외에 다양한 옵션들이 더 있습니다.
웹프로그램밍 자료실/JAVA 자료 2019. 9. 17. 09:08
[해피CGI][cgimall] Fully Customizable Organisational Chart Plugin With jQuery - OrgChart

조직의 조직도나, 구성원들의 구성도를 쉽게 웹페이지에 표시하는 용도로 사용하면 좋을것 같습니다. 첨부된 파일을 다운로드 받아서 압축을 해제한후 demo/index.html 파일을 웹브라우저로 열어서 보면 확인이 가능합니다. 여러가지 유형의 예제들을 데모로 확인이 가능합니다. 구성원 위에 표시되는 좌우 아이콘을 이용해서 구성도를 접었다가 펼쳤다가 하는 예제입니다. 화면에서 구성도를 편집하는 것도 예제가 있습니다. 검색하고자 하는 단어로 필터링 해서 관계가 연결된 구성원만 보여주는 것도 가능하네요. 지도와 연결해서, 구성원을 클릭하면 해당 구성원이 있는 위치로 이동하는 예제도 있습니다. 각 구성원들의 정보를 클릭하면, 아이콘으로 추가로 표시해주는 것도 있습니다. 그 외에도 여러가지 예제들이 있으며, 어떤 조..
웹프로그램밍 자료실/JAVA 자료 2019. 8. 29. 09:11
[해피CGI][cgimall] 인포그래픽 참고하기 좋은 사이트 datavizproject

"DataVizProject"는 다양한 인포그래픽 디자인을 참고할 수 있는 사이트입니다. 사이트 접속 시 다양한 종류의 인포그래픽 디자인 형태를 확인할 수 있으며, 원하는 디자인을 선택 후, 상세페이지에 들어가면 아래의 캡쳐와 같이 선택한 디자인에 맞는 다양한 사용예시들을 확인할 수 있습니다. 사용예시 뿐만 아니라 선택한 디자인이 어떤 상황에서 선택한 디자인이 사용되는지 등 간락한 설명도 있어 인포그래픽 디자인에 대해 많이 배울 수 있을 것 같아 추천드립니다.
웹프로그램밍 자료실/기타 자료 2019. 4. 18. 09:13
[해피CGI][cgimall] Zeu 차트 jQuery

jQuery 를 이용하여 데이터를 차트화 할 수 있습니다. 차트 종류가 다양하게 제공되는데요. 꼭 서버의 모니터링 툴을 만들때 cpu 사용량이나 메모리 사용량 등에 쓰면 좋을듯 하네요 ^^; 아래의 코드로 쉽게 시작 할 수 있습니다. ^^ // Create a Zeu TextMeter. var textMeter = new zeu.TextMeter('text-meter'); // Update display and percentage value. textMeter.displayValue = 'ZEU'; textMeter.value = 90; *License : MIT
웹프로그램밍 자료실/JAVA 자료 2019. 2. 15. 09:18
[해피CGI][cgimall] 차트 라이브러리 오픈소스, nwagon

다양한 효과의 차트 라이브러리 오픈소스 nwagon은 손쉬운 사용이 가능하며, 간결한 다양한 디자인을 제공합니다. nwagon 오픈소스 차트 라이브러리는 추가적인 작업없이 차트 구현이 용이하고 JSON형태로 손쉬게 사용이 가능하다. 또한 간결한 다양한 디자인이 제공되며, SVG를 이용하여 랜더링 속도가 빠르다. 그외 크로스브라우징을 지원한다. radar형, 막대형, 선형, 영역형 등등 총 8가지의 차트 스타일을 기본 제공합니다. 사용방법은 간단합니다.. 해당 사이트에서 제공하는CSS 및 JS를 포함시킨 후 원하는 값에 맞추기만 하면 끝! 활용할때가 많으니.. 많이들 이용해보세요. ​ ​ ​
웹프로그램밍 자료실/JAVA 자료 2017. 11. 23. 10:10
Prev 1 Next