개발하자

안녕하세요. 오늘은 구글차트를 활용하여 파이차트를 만들었습니다 기본적인 파이차트도 있지만 반원으로도 만들 수 있습니다. 간단하게 전체 데이터의 합계를 1개 더 조회해서 가져오는 것인데요 DB에서 데이터를 가져올때 각 데이터 합계, 각 데이터 총합계 이렇게 들고 오면 가능합니다. 예를 들어서 오렌지 20, 사과 30의 데이터가 있다면 안보일 데이터 50을 가져오는 것이지요 | 오렌지 20 / 사과 30 / 반원으로 사용될 데이터 50 예제 데이터 가져오는 쿼리 (가독성이 떨어지는 쿼리이지만 느리거나 문제가 되진 않습니다.) '무'라고 되어있는 데이터가 전체 데이터 합계입니다.(안보이는 반원) select A.* from ( select '매우불만족' as grade, ifnull(round(avg(OVAL..

구글 차트를 만들고 그래프에 마우스를 올리면 툴팁이 나타납니다. 툴팁과 그래프가 맞닿는 부분에 마우스 커서가 있다면 툴팁이 깜빡이는 현상을 볼 수 있는데요 이 부분은 css로 해결 가능합니다! svg > g > g:last-child { pointer-events: none } 위 소스를 css에 넣어주기만 하세요 공부하면서 유용했던 부분 메모겸 공유하고자 끄적입니다. 고쳐야하는 부분있다면 댓글 남겨주시면 수정하겠습니다. 행복한 하루 보내세요 (❁´◡`❁)

오늘은 Google Charts 에서 막대그래프에 대한 설명입니다. 아래 링크에 접속하면 막대그래프 외에 여러가지 차트를 확인할 수 있어요 차트 갤러리 | Charts | Google for Developers 이 페이지는 Cloud Translation API를 통해 번역되었습니다. Switch to English 의견 보내기 차트 갤러리 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요. Google 갤러리는 developers.google.com 구글차트를 활용해 그래프를 그리는 것은 간단합니다 저는 월별로 방문자수(명)을 막대로 표출했는데요 실제 소스에서는 DB의 데이터를 가져왔지만 여기서는 하드코딩 된 예제를 작성하려 합니다. 여기서 포인트는 google.visuali..

오늘은 프린트 기능 구현! 프린트 버튼을 클릭하면 새창으로 프린트할 내용이 있는 URL 이동, 프린트 완료 후 창닫기까지 구현은 간단하다. 1. 프린트 버튼이 있는 jsp a 태그를 누르면 이동하고자하는 url을 가지고 openAndPrint() 함수로 이동 newWindow.print()로 프린트 구현 프린트 2. 프린트 할 내용이 있는 jsp (url) 위에서 지정한 /url 페이지 프린트 기능이 끝나고 창을 닫기위한 script css가 필요한 상황이라면 개발자모드로 프린트 기능에서 제공하는 css 확인 후 !important로 적용 컬럼1 데이터1 컬럼2