PureJS 탭과 함께 차트를 사용 중입니다.
페이지 정보
작성자 유니 작성일 2023-02-06 13:47 조회 656회 댓글 0건본문
관련링크
ui는 Rui라는 타 프로그램을 사용하고 있습니다.
해당 부분에서 Rui로 탭을 구성 후, 검색 조건으로 년도를 클릭 후, 탭에 맞게 차트를 구성하고 있습니다.
년도로 처음 데이터를 불러와 차트를 구성할 때에는 탭별로 정상적으로 차트가 동작하나,
년도를 변경 후 탭을 클릭하면 이전 데이터로 차트가 구성되고 있습니다.
(예 2023년으로 검색 후 탭1의 차트를 보고 2022년으로 검색 후 탭1을 보면 차트가 정상적으로 나옵니다.
2023으로 검색 후 탭1, 탭2, 탭3, 탭4의 차트를 확인 후 2022년으로 변경 후 탭1, 탭2, 탭3, 탭4 차트를 확인하면
2023 차트의 내용이 나오고 있습니다.)
년도 변경시 차트가 있다고 오류가 발생 하여, if를 통해서 차트가 있는지 여부를 파악 후 차트를 만들었습니다.
아래는 코드를 몇몇 부분만 정리해서 올렸습니다.
console.log(barchart.itemsSource)로 로그를 찍을 경우 데이터 변경되는 것이 확인 되었으나, 실제 차트의 모양은 변경되지 않아 문의 드립니다.-------------------------------------------
var barchar; //탭 클릭 시마다 해당 탭의 idx를 넘겨서 chart 만드는 함수를 호출
chart_init(idx); function chart_init(idx) { if(차트가 있을 시){ var data = new wijmo.collections.CollectionView(charDate); barchar.collectionView.refresh(); barchar.refresh(true); barchar.itemsSource = data; } else { barchar = new wijmo.char.FlexChar('#charGrid'+idx, { legend : {position: wijmo.chart.Position.Right}, axisY : { format: '{value:n0}' }, bindingX : 'country', series: charSeries, stacking: wijmo.chart.Stacking.Stacked, selectionMode: wijmo.chart.SelectionMode.Point, itemsSource : charDate, }) } }
댓글목록
등록된 댓글이 없습니다.