小程序echarts数据不改变,或者是一次渲染成功,第二次进入,渲染失败的解决办法

1、引入echarts插件:

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

2、data中定义:

  ecBar: {

    onInit: initChart

  },

3、app.js中定义全局变量:

  globalData: {

    userInfo: null,

    all_date: []

  },

4、onload中,定义一个 all_date ,用来接收数据

5、循环出来的数据,赋值:app.globalData.all_date = all_date

6、在 value 中赋值:

function initChart(canvas, width, height) {
    const chart = echarts.init(canvas, null, {
        width: width,
        height: height
    });
    canvas.setChart(chart);

    var option = {
        backgroundColor: "#ffffff",
        color: ["#37A2DA", "#FF9F7F"],
        tooltip: {},
        xAxis: {
            show: false
        },
        yAxis: {
            show: false
        },
        radar: {
            indicator: [{
                name: '10米折返跑',
                max: 5
            },
            {
                name: '立定跳远',
                max: 5
            },
            {
                name: '网球掷远',
                max: 5
            },
            {
                name: '走平衡木',
                max: 5
            },
            {
                name: '坐位体前屈',
                max: 5
            },
            {
                name: '双脚连续跳',
                max: 5
            }
            ]
        },
        series: [{
            name: '',
            type: 'radar',
            itemStyle: {
                normal: {
                    areaStyle: {
                        type: 'default'
                    }
                }
            },
            data: [{
                value: app.globalData.all_date,
                name: ''
            }]
        }]
    };

    chart.setOption(option);
    return chart;
}

7、在 wxml 调用:<ec-canvas ></ec-canvas>

总体来说,设置单页的全局变量,不能改变小程序图表的二次渲染,要设置成app.js的全局变量才行