vue多实例情况下eacharts的异步获取数据

34 篇文章 0 订阅
24 篇文章 2 订阅

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)
            })

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值