Ext JS Chart

  1   Sencha CMD

---

 Ext JS에서 Chart를 이용하기 위해서는 Sencha 에서 제공하는 "ext-charts" 패키지를 빌드해야한다. 이 패키지를 빌드하지않고 그냥 차트를 가져다 쓰려고하면 "차트가 어딨는지도 모르겠고 정의된것 같지도 않다"의미를 담은 애러메시지를 띄우게 된다.

다음과 같이 커맨드창에서 "ext-charts" 패키지의 경로로 이동한다. 이동 후에 다음의 명령어를 실행.

sencha package build

빌드가 완료되면 자신의 앱의 Home 경로로 가서 앱 리프레시를 위해 다음의 명령어 실행.

sencha app refresh

Sencha CMD에서 할일은 이게 끝이다. 여기까지 하면 "ext-chart" 패키지를 사용하기 위한 사전준비는 끝났음.

  2   app.json Source

---

 이제 프로젝트로 건너와서 프로젝트 내 app.json 파일을 수정한다. 수정이라기보다 난 이 "ext-chart" 패키지를 사용하겠으니 앱이 구동될때 불러와라 라고 추가하는정도이다. app.json 파일에 다음의 코드를 추가한다. 기본적으로 Sencha CMD를 이용하여 생성한 앱이라면 밑의 모든코드를 추가할 필요없이 해당 구역에 "sencha-charts" 문구만 추가하면 된다.

  3   View Source

---

 

코드를 작성하면서 드는 의문점.. Ext Sample 에서는 차트의 레전드부분이 그냥 추가만 해도 이쁘게 나왔는데 내가하면 그냥 텍스트로 나와서 왜그러나 찾다찾다 겨우 못찾고 tpl을 사용했다. 찾아보니 버그라고 하는것도 있고.. 버그면 왜 sample에서는 정상동작하는 거지..

  4   Result

---