wanzb_xcx/pages/index/index.js

import * as echarts from '../../ec-canvas/echarts';

const app = getApp();
var host = app.globalData.host;
Page({
  data: {
    ec: {
      // onInit: initChart
      lazyLoad: true
    },
    timer: '',
    datas:{},
    userInfo:{}
  },
  onReady: function () {               //这一步是一定要注意的
    
  },
  onLoad(){
    
    wx.showNavigationBarLoading()
    /**获取token */
    wx.getStorage({
      key: 'userInfo',
      success: res => {
        if (res.data){
          this.setData({
            userInfo: res.data
          })
          this.getData();
        }else{
          wx.switchTab({
            url: '../user/user',
          })
        }
      },
      fail:error=>{
        
        //跳转到登陆页面
        wx.switchTab({
          url: '../user/user',
        })
      }
    })
  },
  onShow(){
    if (!this.data.userInfo.token) {
      this.onLoad()
    }else{
      wx.showNavigationBarLoading()
      this.getData()
    }
  },
  getData(){
    
    wx.request({
      url: host + '/api/wx/index',
      header: {
        'Authorization': this.data.userInfo.token
      },
      success: res=> {
        console.log(res)
        wx.hideNavigationBarLoading()
        if(res.data.code != 0){
          wx.showToast({
            icon: 'none',
            title: res.data.message,
          })
           return
        }
        this.setData({
          datas: res.data.data
        })
       
        if (res.data.data.records.length<=0){
            return;
       }
        var records = res.data.data.records, xdata = [], ydata = [];
        for (let i = 0; i < records.length; i++) {
          let date = records[i].stock_date.split('-');
          xdata.push(date[1] + '/' + date[2])
          let y = records[i].total_income.replace('%','')
          ydata.push(Number(y))
        }
        xdata = xdata.reverse()
        ydata = ydata.reverse()
        this.oneComponent = this.selectComponent('#mychart');
        this.init_one(xdata, ydata)

      },
      fail: error => {
        //跳转到登陆页面
        wx.switchTab({
          url: '../user/user',
        })
      }
    })
  },
  init_one: function (xdata, ydata) {           //初始化第一个图表
    this.oneComponent.init((canvas, width, height, dpr) => {
      const chart = echarts.init(canvas, null, {
        width: width,
        height: height,
        devicePixelRatio:dpr
      });
      setOption(chart, xdata, ydata)
      this.chart = chart;
      return chart;
    });
  },
});






function setOption(chart, xdata, ydata) {
  console.log(ydata)
  var option = {
    legend: {
      show: false
    },
    grid: {
      x: 50,
      y: 40,
      x2: 10,
      y2: 35
    },
    tooltip: {
      show: true,
      trigger: 'axis',
      formatter: '{b0}: {c0}%'
    },
    xAxis: {
      type: 'category',
      data: xdata,
      axisLabel: {
        interval: 0,
        rotate: 40,
        color: '#999999'
      }
    },
    yAxis: {
      axisLine: {
        show: true
      },
      type: 'value',
      name: '收益曲线',
      axisLabel: {
        formatter: function (value, index) {//隐藏 0
          let texts = [];
          texts.push(value+'%')
          return texts;
        },
        show: true
      },
    },
    series: [{
      name: 'A',
      type: 'line',
      smooth: true,
      symbolSize: 8,
      lineStyle: {
        color:'#FF2D68'
        // color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [{
        //   offset: 0,
        //   color: '#FF2D68'
        // }, {
        //   offset: 1,
        //   color: '#4C4BFF'
        // }]),
      },
      itemStyle: {
        borderWidth: 5,
        borderColor: '#FFAD52',
        color: '#FFAD52'
      },
      data: ydata
    }]
  };
  chart.setOption(option)
}