FlexChart에서 재조회 할때 방법

FlexChart에서 재조회 할때 방법 > Q&A | 토론

VueJS FlexChart에서 재조회 할때 방법

추천0 비추천 0

페이지 정보

작성자 CWJ83

작성일 2023-09-05 15:21 조회 292회 댓글 0건

검색

제품 버전 : wijmo-5.20231.888_KR

컨트롤 이름 : FlexChart

본문

관련링크

안녕하세요.

회사에서 wijmo 솔루션을 구매하여 개발중입니다.

vue.js로 FlexChart 구현중인데요

최초 차트는 정상적으로 그려지고

차트옵션을 변경하면 차트를 다시 생성해야할때 destroy(?)와 같은 기능으로 제거하고 다시 그려야하는데 찾기가 어렵습니다.

어떤 메소드?를 사용해야 할가요?

Uncaught (in promise) ** Assertion failed in Wijmo: Element is already hosting a control. Error

at assert (http://localhost:8081/node_modules/.vite/deps/chunk-M45Q6DKF.js?v=d81850f2:889:13)

at FlexChart2.Control2 [as constructor] (http://localhost:8081/node_modules/.vite/deps/chunk-M45Q6DKF.js?v=d81850f2:3930:5)

at FlexChart2.FlexChartBase2 [as constructor] (http://localhost:8081/node_modules/.vite/deps/chunk-LGBEID4L.js?v=d81850f2:1301:29)

at FlexChart2.FlexChartCore2 [as constructor] (http://localhost:8081/node_modules/.vite/deps/chunk-LGBEID4L.js?v=d81850f2:5584:15)

at new FlexChart2 (http://localhost:8081/node_modules/.vite/deps/chunk-LGBEID4L.js?v=d81850f2:6930:15)

at Proxy.drawChart (http://localhost:8081/src/spreadjs/exam3.vue?t=1693894596729:124:23)

if(visual_chart != "") {
    				console.log(visual_chart)
    				//이곳에서 차트제거
    			}
    			visual_chart = new wjChart.FlexChart('#myChart');
    			visual_chart.initialize({
    			    itemsSource: chart_result,
    			    chartType: this.visual.chart_type,
    			    header: this.visual.chart_name,
    			    bindingX: 'date1',
    			    legend: {
    		            position: legend_position
    		        },
    			    legendToggle : true,
    			    series: series_list
    			});
    			
    			let ani = new animation.ChartAnimation(visual_chart);

댓글목록

등록된 댓글이 없습니다.

VueJS Re: FlexChart에서 재조회 할때 방법

추천0 이 글을 추천하셨습니다 비추천0 채택채택

페이지 정보

작성자 GCK루시

작성일 2023-09-07 13:39 댓글 0건

본문

관련링크

안녕하세요 그레이프시티입니다.

문의하신 기능의 경우는 호스트 요소와의 연결을 제거하여 컨트롤을 삭제해주는 dispose 메서드를 이용하시면 됩니다.

<button @click="reload">재조회</button>
<wj-flex-chart id="myChart" :itemsSource="data" header="Country GDP(B$)" bindingX="country" :initialized="initChart">
(...),
  data() {
    return {
      data: getData(),
      chart: null,
    };
  },
  methods: {
    initChart: function (s, e) {
      this.chart = s;
    },
    reload: function () {
      this.chart.dispose();
      this.chart = new chart.FlexChart("#myChart");
      this.chart.initialize({ itemsSource: getData(), chartType: "Line", header: "test", bindingX: "country", series: [{ binding: "2016", name: "2016" }],
      });
    },
  },

다만 컨트롤을 삭제 및 재생성하는 방법보다 속성값을 재설정하는 방법이 퍼포먼스에 덜 부담가는 방법이므로 아래 코드와 같이 속성값을 변경 처리하는 방식도 참고하시기 바랍니다.

reload: function () {
this.chart.itemsSource = getData();
this.chart.chartType = "Line";
this.chart.bindingX = "year";
(...)

- dispose API 문서

관련 API 문서를 공유드리며 다른 궁금한 점이 생기면 문의주시기 바랍니다.

감사합니다.

그레이프시티 드림

댓글목록

등록된 댓글이 없습니다.

FlexChart에서 재조회 할때 방법 > Q&A | 토론

MESCIUS 포럼

MESCIUS 커뮤니티

MESCIUS 포럼

MESCIUS 커뮤니티

Wijmo

Q&A | 토론 - VueJS

VueJS FlexChart에서 재조회 할때 방법

페이지 정보

본문

관련링크

댓글목록

VueJS Re: FlexChart에서 재조회 할때 방법

페이지 정보

본문

관련링크

댓글목록

카테고리

인기글

최신글

셀럽