// pages/member/Performance/Performance.js const echarts = require('../../../../ec-canvas/echarts'); //路径一定要正确否则会调用错误 var app = getApp(); Page({ /** * 页面的初始数据 */ data: { language: '', ec: { lazyLoad: true // 延迟加载 }, total: '', month: '', today: '', recent: '', xdate: [], ydate: [] }, /** * 生命周期函数--监听页面加载 */ onLoad: function(options) { this.echartsComponnet=this.selectComponent('#mychart'); this._getPerformance(); }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function() { let language = wx.getStorageSync('langIndex'); this.setData({ 'language': language.en}); }, /** * 生命周期函数--监听页面显示 */ onShow: function() { }, /** * 生命周期函数--监听页面隐藏 */ onHide: function() { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function() { }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function() { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function() { }, /** * 用户点击右上角分享 */ onShareAppMessage: function() { }, _getPerformance() { let that = this; let urlStr = app.getNetAddresss('finance.OrderAll'); app._getNetWork({ url: urlStr, success: function(resdata) { var res = resdata.data; if (res.result == 1) { that.setData({ total: res.data.all, month: res.data.month, today: res.data.today, recent: res.data.recent }); for (var value in that.data.recent) { let xdate = that.data.xdate; let ydate = that.data.ydate; xdate.push(that.data.recent[value].date); ydate.push(that.data.recent[value].price); that.setData({ xdate: xdate, ydate: ydate }); } that.init_echarts(); //初始化图表 } else { wx.showToast({ icon: 'none', title: res.msg, duration: 1500 }); } }, fail: function(res) { console.log(res.msg); } }); }, //初始化图表 init_echarts: function() { this.echartsComponnet.init((canvas, width, height) => { // 初始化图表 const Chart = echarts.init(canvas, null, { width: width, height: height }); Chart.setOption(this.getOption()); // 注意这里一定要返回 chart 实例,否则会影响事件处理等 return Chart; }); }, getOption: function() { // 指定图表的配置项和数据 var option = { title: { text: '最近7天营业额(万元)', textStyle: { fontSize: 14, color: '#FF5511' } }, xAxis: { type: 'category', data: this.data.xdate, boundaryGap: false, axisLabel: { fontSize: 14, fontFamily: 'Arial', interval: 0, rotate: 30 } }, yAxis: { type: 'value', axisLabel: { fontFamily: 'Arial', } }, series: [{ data: this.data.ydate, type: 'line', hoverAnimatio: true }] }; return option; }, });