dd_xcx/pages/workbench/statistics_B/statistics_B.js

var app = getApp()
var that;
Page({
  data: {
    date: app.globalData.month,
  },
  onLoad() {
    that = this;
    dd.setNavigationBar({title:"我的B分统计"});
    app.globalData.showToast('success', '你好啊')
  },
  //则线图
  onInitChart(F2, config) {
    const chart = new F2.Chart(config);
    const data = [{
      date: '1月',
      value: 116
    }, {
      date: '2月',
      value: 129
    }, {
      date: '3月',
      value: 135
    }, {
      date: '4月',
      value: 86
    }, {
      date: '5月',
      value: 73
    }, {
      date: '6月',
      value: 85
    }];
   chart.source(data, {
      date: {
        range: [ 0, 1 ]
      }
    });
    chart.line().position('date*value');
    chart.point().position('date*value').style({
      stroke: '#fff',
      lineWidth: 1
    });
    chart.render();
    // 注意：需要把chart return 出来
    return chart;
  },
  //饼型图
  onInitChart2(F2, config){
    const chart = new F2.Chart(config);
    const map = {
      芳华: '40%',
      妖猫传: '20%',
      机器之血: '18%',
      心理罪: '15%',
      寻梦环游记: '5%',
      其他: '2%'
    };
    const data = [{
      name: '芳华',
      percent: 0.4,
      a: '1'
    }, {
      name: '妖猫传',
      percent: 0.2,
      a: '1'
    }, {
      name: '机器之血',
      percent: 0.18,
      a: '1'
    }, {
      name: '心理罪',
      percent: 0.15,
      a: '1'
    }, {
      name: '寻梦环游记',
      percent: 0.05,
      a: '1'
    }, {
      name: '其他',
      percent: 0.02,
      a: '1'
    }];
    chart.source(data, {
        percent: {
          formatter: function formatter(val) {
            return val * 100 + '%';
          }
        }
      });
    chart.legend({
      position: 'right',
      itemFormatter: function itemFormatter(val) {
        return val + '  ' + map[val];
      }
    });
    chart.tooltip(false);
    chart.coord('polar', {
      transposed: true,
      radius: 0.85
    });
    chart.axis(false);
    chart.interval()
      .position('a*percent')
      .color('name', [ '#1890FF', '#13C2C2', '#2FC25B', '#FACC14', '#F04864', '#8543E0' ])
      .adjust('stack')
      .style({lineWidth: 1, stroke: '#fff', lineJoin: 'round', lineCap: 'round'}).animate({
        appear: { duration: 1200,easing: 'bounceOut'}
      });
    chart.render();
    // 注意：需要把chart return 出来
    return chart;
  },
  //时间选择
  openDate() {
    dd.datePicker({
      format: 'yyyy-MM',
      currentDate: that.data.date,
      success: (res) => {
        that.setData({
          date: res.date
        })
      },
    });
  }
});