HOME
물생활
일상생활
개발

c3 3

javascript ) 차트 라이브러리 추천

예전에나 지금이나 차트를 표시해줘야 할 때는 c3.js를 잘 이용하고 있다. 근데 사용하다보니 디자인이 좀 질려서.. 직접 커스텀 하기는 또 귀찮고 다른 차트 라이브러리는 어떤게 있는지 좀 찾아봤다. 1. c3.js C3.js | D3-based reusable chart library Comfortable C3 makes it easy to generate D3-based charts by wrapping the code required to construct the entire chart. We don't need to write D3 code any more. Customizable C3 gives some classes to each element when generating, so you can..

개발/Javascript 2023.12.12

javascript ) c3.js 차트에 데이터 연동하기 (ajax + php + mysql)

c3.js 설치 및 기본 사용법은 아래 링크 참고 https://vivacolor96.tistory.com/68 javascript ) c3.js를 이용한 차트 표시 쇼핑몰 관리자를 작업중인데, 대시보드에 매출이나 회원 등의 수치 변화를 나타내는 그래프를 표시해주어야 했다. 예전 작업에서 사용했던 c3.js가 생각나서 사용해보기로 했다. 시작하기 일단 vivacolor96.tistory.com 위의 내용까지는 javascript 안에서 노출하고자 하는 값을 배열에 직접 값을 넣어주었다. 하지만 분석용 차트 표시하면서 이렇게 사용할 사람은 많지 않겠지.. 나 또한 쇼핑몰 관리자에서 여러 값의 변화를 표시하기 위해 사용하는 것이므로 데이터 연동이 필수적이다. 페이지 로딩하자마자 보이는 차트라서 ajax를 사..

개발/Javascript 2023.12.11

javascript ) c3.js를 이용한 차트 표시

쇼핑몰 관리자를 작업중인데, 대시보드에 매출이나 회원 등의 수치 변화를 나타내는 그래프를 표시해주어야 했다. 예전 작업에서 사용했던 c3.js가 생각나서 사용해보기로 했다. 시작하기 일단 아래 깃허브 링크에서 c3.js를 다운받는다. https://github.com/c3js/c3/releases/tag/v0.7.20 Release v0.7.20 · c3js/c3 Changes Fix config subchart_axis_x_show (#2806) Fix pan of y-axis when zoomed and rotated=true #2799 (#2805) github.com 서버에 올리고, 아래처럼 사이에 추가해준다. 1 2 3 4 5 6 cs c3는 d3기반으로 이루어져 있다. d3.js도 함께 불러와..

개발/Javascript 2023.12.09