vue多實例情況下eacharts的異步獲取數據

html就不寫了,自行解決吧,下面寫寫js

一:首先在methods中寫一個模型:

methods(){

  huitu_yxqs(){
  var myChart5 = echarts.init(document.getElementById('qushi_fx'));
  myChart5.setOption({
            title: {
                text: '營銷趨勢分析'
            },
            tooltip: {},
            legend: {
                data:['收費金額','預交款金額'],
                orient:'vertical',
                right:0,
                top:20
            },
            xAxis: {
                data: this.yxqs_xAxis  //這裏是動態加載的數據--其中yxqs_xAxis需要在data中定義
            },
            yAxis: {},
            series: this.yxqs_series  //這裏是動態加載的數據--其中yxqs_series 需要在data中定義
        });
  },

}

二,在事件中post請求數據並畫圖

data_cha(){

                let that=this
      $.post("/count/index", { type: 1, data2: this.value2 },
            function(data) {
            //把異步獲取的數據更新給模型
            that.yxqs_xAxis=data.data.yingxiaoqushi.date
            let nu=[]
            nu.push(data.data.yingxiaoqushi.shoufei)
            nu.push(data.data.yingxiaoqushi.yujiao)
            that.yxqs_series=nu
            that.huitu_yxqs()  //這裏在更新完數據後調用繪圖函數來畫圖
          //console.log(data)
            })

}

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章