|
@@ -3,6 +3,7 @@ import * as echarts from '../../../commpents/ec-canvas/echarts'
|
|
|
Page({
|
|
|
data: {
|
|
|
frameStyle: { useTop: true, name: '付费情况', leftArrow: true, useBar: false },
|
|
|
+ // xdata: []
|
|
|
},
|
|
|
// 返回
|
|
|
back(e) {
|
|
@@ -19,30 +20,21 @@ Page({
|
|
|
wx.getStorage({
|
|
|
key: 'user',
|
|
|
success: async res => {
|
|
|
- that.setData({
|
|
|
- ec: {
|
|
|
- onInit: that.initChart
|
|
|
- }
|
|
|
- })
|
|
|
- // 模拟请求
|
|
|
- var times = setTimeout(async function () {
|
|
|
- // 数据
|
|
|
- that.data.xdata = [
|
|
|
- { value: 2, name: '1月(钱数)' },
|
|
|
- { value: 10, name: '2月(钱数)' },
|
|
|
- { value: 19, name: '3月(钱数)' },
|
|
|
- { value: 20, name: '4月(钱数)' },
|
|
|
- { value: 70, name: '5月(钱数)' },
|
|
|
- { value: 9, name: '6月(钱数)' },
|
|
|
- { value: 12, name: '7月(钱数)' },
|
|
|
- { value: 41, name: '8月(钱数)' },
|
|
|
- { value: 31, name: '9月(钱数)' },
|
|
|
- { value: 13, name: '10月(钱数)' },
|
|
|
- { value: 16, name: '11月(钱数)' },
|
|
|
- { value: 10, name: '12月(钱数)' }
|
|
|
- ];
|
|
|
- clearTimeout(times);
|
|
|
- }, 1000)
|
|
|
+ that.setData({ ec: { onInit: that.initChart } })
|
|
|
+ that.data.xdata = [
|
|
|
+ { value: 2, name: '1月' },
|
|
|
+ { value: 10, name: '2月' },
|
|
|
+ { value: 19, name: '3月' },
|
|
|
+ { value: 20, name: '4月' },
|
|
|
+ { value: 70, name: '5月' },
|
|
|
+ { value: 9, name: '6月' },
|
|
|
+ { value: 12, name: '7月' },
|
|
|
+ { value: 41, name: '8月' },
|
|
|
+ { value: 31, name: '9月' },
|
|
|
+ { value: 13, name: '10月' },
|
|
|
+ { value: 16, name: '11月' },
|
|
|
+ { value: 10, name: '12月' }
|
|
|
+ ];
|
|
|
},
|
|
|
fail: async res => {
|
|
|
wx.redirectTo({ url: '/pages/index/index' })
|
|
@@ -52,41 +44,30 @@ Page({
|
|
|
// 饼图
|
|
|
initChart(canvas, width, height, dpr) {
|
|
|
let that = this;
|
|
|
- // 由于请求数据有延迟所以写一个时间函数,当数据存在的时候再执行绘制
|
|
|
- var times = setInterval(function () {
|
|
|
- var xdata = that.data.xdata;
|
|
|
- if (xdata) {
|
|
|
- clearInterval(times)
|
|
|
- const chart = echarts.init(canvas, null, {
|
|
|
- width: width,
|
|
|
- height: height,
|
|
|
- devicePixelRatio: dpr // new
|
|
|
- });
|
|
|
- canvas.setChart(chart);
|
|
|
- var option = {
|
|
|
- tooltip: {
|
|
|
- trigger: 'item'
|
|
|
- },
|
|
|
- series: [
|
|
|
- {
|
|
|
- name: 'Access From',
|
|
|
- type: 'pie',
|
|
|
- radius: '50%',
|
|
|
- data: xdata,
|
|
|
- emphasis: {
|
|
|
- itemStyle: {
|
|
|
- shadowBlur: 10,
|
|
|
- shadowOffsetX: 0,
|
|
|
- shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
- chart.setOption(option, true);
|
|
|
- return chart;
|
|
|
- }
|
|
|
- }, 100)
|
|
|
+ var xdata = that.data.xdata;
|
|
|
+ const chart = echarts.init(canvas, null, { width: width, height: height, devicePixelRatio: dpr });
|
|
|
+ canvas.setChart(chart);
|
|
|
+ var option = {
|
|
|
+ tooltip: { trigger: 'item' },
|
|
|
+ legend: {
|
|
|
+ orient: 'vertical',
|
|
|
+ height: 40,
|
|
|
+ padding: 50
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: '课时费',
|
|
|
+ type: 'pie',
|
|
|
+ radius: '50%',
|
|
|
+ data: xdata,
|
|
|
+ emphasis: {
|
|
|
+ itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ chart.setOption(option, true);
|
|
|
+ return chart;
|
|
|
},
|
|
|
/**
|
|
|
* 生命周期函数--监听页面初次渲染完成
|