Vue3 에서 EChart 사용방법 천천히 익혀보기 1편

회사에서 vue로 개발을 하고있는 1인으로써 EChart 를 사용하게 된다. 

 

라이브러리 사용하는거라서 단순하지만 아직 구조를 파악하지 못하고 

 

주어진 틀에 값넣고 하는거같아서 매번 Echart 사용하는데 답답함을 느끼는바이다.. 

 

그래서 18일 잠자기전까지 Echart 그리는 방법 익히고 

 

시간되면 Ag-grid 하는방법도 봐야겠다. 

 

 

 

일단 api 를 무슨 api 를 구성할지 생각해보고 

아무래도 공공데이터 포털에 있는거 사용해야겠지 ? 

 

음 그래프 그리는거 

1. 선 그래프

2. 바 그래프

3. 도넛 모양 그래프 

크게 나누면 세가지인거같다. 

 

서울특별시_영등포구_반려동물등록현황 이걸로 작업하기로 결정~~~ 땅땅땅~~~ 

 

https://echarts.apache.org/en/index.html

Apache ECharts

 

 

EChart 홈페이지 접속 ㄲ 

 

음 뭔말인지 모르니깐 다름사람들이 써둔 블로그 참고하기~ 

 

 

 

내가 해야할일은 vue로 그래프 틀을 컴포넌트화 해서 그것을 어디서든 가져다 쓸수있게 만드는게 나의 목표임!!!!!! 

 

일단 vs 코드 열어서 vue3 파일 하나 열어서 echart 연습할수있는 틀 하나 만들기~~ 

 

 

---

https://velog.io/@onehousesilver/Vue-3-router-%EC%97%B0%EA%B2%B0-%EC%95%88%EB%90%A0%EB%95%8C

Vue 3 router 연결 안됨

router 오류 났는데 이거 보고 해결함 ~ 기분좋당

---

 

나에게 과외쌤이 있다 그 이름은 쳇gpt 그친구한테 html, css 짜달라고함 

 

 

일단 이렇게 만들고 나의 계획은 content 영역마다 다양한 그래프를 넣을 예정임 

router 때문에 한시간 날려먹었다 그치만 담에 저런 실수는 안하겠찌?>< 

 

 

 

자자 다른 소리 하지말로 드디어 본격적으로 echart를 실시할건데 

 

vue3 에서 echart에서는 터미널에서 설치를 해야한다 ! 

 

이미 다른 블로그에서 너무 잘 써놔서 그거 참고하자~ 

 

https://sanblog.tistory.com/4

[vue] Echart bar 차트 만들기

 

 

급 당이 떨어진다 나의 목표 1시간 달성................ 

 

 

아 route 땜시 끝내지 못했다 2편에서 계속 한다///.....