본문 바로가기

jQuery

[jqPlot] jqPlot 막대 그래프에 레이블 생성하기 ■ jqPlot 막대 그래프에 레이블 생성하기 01. 이번에는 생성한 막대 그래프 위에 정보를 표시할 레이블을 올려보자. jqplot.pointLabels.js 플러그인을 추가하고 css를 지정하면된다. jqplot_bar_chart_with_point_labels.php 02. 아래 출력결과처럼 막대그래프 상단에 정보를 표시하는 레이블이 나타는것을 알 수 있다. 더보기
[jqPlot] jqPlot의 막대 그래프 그리기 ■ jqPlot의 기본적인 막대 그래프 01. jqPlot을 사용하여 가장 기본적인 막대 그리프 차트를 그려보자. 코드는 아래와 같다. jqplot_bar_chart_with_varying_colors.php 02. 출력결과는 아래와 같이 막대 그래프 차트가 나타나는것을 확인 할 수 있다. ■ jqPlot 막대 그래프 에 랜덤으로 색상 집어넣기 01. 위 에서 진행한 코드에서 varyBarColor 속성을 추가하여 무작위로 색상을 넣어보자. jqplot_bar_chart_with_varying_colors.php 02. 출력결과는 아래와 같이 랜덤으로 막대 그래프에 색상이 들어가 있는것을 확인 할 수 있다. ■ jqPlot 막대 그래프에 색상 지정하여 집어 넣기 01. 바로 위에서 랜덤으로 색상을 집어 .. 더보기
[jqPlot] 플러그인 및 옵션 정리 참조 : 시우아빠님 블로그 ■ jqPlot의 플러그인 정리 ※ jqPlot에는 다수의 플러그인들이 있다 그 플러그인들에 따라 그릴 수 있는 그래프도 천차만별이기에 확인해 두도록 하자. 자주 사용되는 jqPlot plugins 의 종류는 다음과 같다. 플 러 그 인 설 명 jqplot.barRenderer.js · 플러그인은 'plugins'폴더에 들어 있고, 필요에 따라 개별적으로 호출한다. jqplot.blockRenderer.js · 차트를 만들 때 필요합니다. jqplot.bubbleRenderer.js · 버블 차트를 생성하는 데 필요합니다. jqplot.canvasOverlay.js · 그래프에 선을 그 적용하기 위하여 필요합니다. jqplot.categoryAxisRenderer.min.js .. 더보기
[jqPlot] jqPlot 프로젝트 세팅하기. 01. jqPlot(http://www.jqplot.com/) 사이트에 접속하여 메인페이지에서 Download를 클릭한다. 02. 다운로드 페이지에서 jqPlot 라이브러리중 하나를 선택하고 다운받는다. 해당 포스팅은 작성일 기준 가장 최신의 jquery.jqplot.1.0.9.d96a669.zip 파일을 다운받았다. 테스트를 진행하는거라면 가능한 최신 파일을 사용하도록 하자. 03. 이제 jqPlot프로젝트를 실행할 jqplot 폴더를 만들고 해당 폴더내에 css와, js폴더를 추가적으로 각각 생성한다. 04. 먼저 js 폴더에 필요한 파일들을 추가한다. 추가할 파일은 plugins 폴더와 excanvas.js, jquery.jqplot.js, jquery.jqplot.min.js 파일들을 js폴더 에.. 더보기
[w2ui] 그리드(Grid)의 Row(행), Column(열) 변경하기. ■ 그리드 Column(열) 위치 변경하기. 01. 해당 그리드의 컬럼의 위치를 변경하려면 reorderColumns 속성을 지정하고 true를 선언해 주기만 하면 된다. w2ui_reorder_columns.php 02. 출력결과는 아래와 같다. 맨앞측의 라인넘버와(lineNumbers), 체크박스열(selectColumn)은 이동이 불가능 하지만. 다른 행은 자유롭게 이동하는것을 알 수 있다. ■ 그리드 Row(행) 위치 변경하기. 01. 해당 그리드의 로우의 위치를 변경하려면 reorderRows 속성을 지정하고 true를 선언해 주기만 하면 된다. w2ui_reorder_records.php 02. 출력결과는 아래와 같다. 선택한 행을 클릭하여 드래그 함으로써 특정 위치로 이동 시킬 수 있다. 더보기

티스토리툴바