echart单个实例中包含三个grid时,legend图例无法显示

描述:当前是关于Echarts图表中的 折线图 示例。
 
            var dataAll = [

    [10.0, 8.04, 3, 5, 8],
    [8.0, 6.95, 2, 9, 2],

    [10.0, 9.14, 6, 4, 2],
    [8.0, 8.14, 2, 8, 9],

    [10.0, 7.46, 0, 2, 4],
    [8.0, 6.77, 0, 1, 2],
    [6.0, 2, 1, 2]

];



option = {
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        show: true,
        data: ['1111111', '222222', '3333333333', '444444'],
        right: 0,
        top: 0,
        textStyle: {
            color: '#345123',
            fontSize: 30
        }
    },
    grid: [{
        show: true,
        left: 30,
        top: '10%',
        width: '80%',
        height: '20%',
        backgroundColor: 'rgba(0,66,108,.2)',
        borderWidth: 0
    }, {
        show: true,
        left: 30,
        top: '36%',
        width: '80%',
        height: '20%',
        backgroundColor: 'rgba(0,66,108,.2)',
        borderWidth: 0
    }, {
        show: true,
        left: 30,
        top: '61%',
        width: '80%',
        height: '20%',
        backgroundColor: 'rgba(0,66,108,.2)',
        borderWidth: 0
    }],
    xAxis: [{
        show: false,
        gridIndex: 0,
        type: 'category',
        splitLine: {
            show: false
        },
        data: [2011, 2012, 2013, 2014, 2015]
    }, {
        show: false,
        gridIndex: 1,
        type: 'category',
        splitLine: {
            show: false
        },
        data: [2011, 2012, 2013, 2014, 2015]
    }, {
        gridIndex: 2,
        type: 'category',
        splitLine: {
            show: false
        },
        axisLine: {
            show: true
        },
        axisTick: {
            show: false
        },
        axisLabel: {
            show: true
        },
        data: [2011, 2012, 2013, 2014, 2015]
    }],
    yAxis: [{
        show: false,
        gridIndex: 0,
        type: 'value'
    }, {
        show: false,
        gridIndex: 1,
        type: 'value'
    }, {
        show: false,
        gridIndex: 2,
        type: 'value'
    }],
    series: [{
        name: '1111111',
        type: 'line',
        symbol: 'circle',
        symbolSize: 20,
        xAxisIndex: 0,
        yAxisIndex: 0,
        itemStyle: {
            normal: {
                color: '#4b9d91',
                lineStyle: { // 系列级个性化折线样式
                    width: 5,
                    type: 'solid'
                },
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: 'rgba(75,157,145,.7)'
                    }, {
                        offset: 1,
                        color: 'rgba(11, 39, 79,.1)'
                    }])
                }
            }
        },
        data: dataAll[0]
    }, {
        name: '222222',
        type: 'line',
        symbol: 'circle',
        symbolSize: 20,
        xAxisIndex: 0,
        yAxisIndex: 0,
        itemStyle: {
            normal: {
                color: '#7840a5',
                lineStyle: { // 系列级个性化折线样式
                    width: 5,
                    type: 'solid'
                },
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: 'rgba(120,64,165,.7)'
                    }, {
                        offset: 1,
                        color: 'rgba(11, 39, 79,.1)'
                    }])
                }
            }
        },
        data: dataAll[1]
    }, {
        name: '3333333333',
        type: 'line',
        symbol: 'circle',
        symbolSize: 20,
        xAxisIndex: 0,
        yAxisIndex: 0,
        itemStyle: {
            normal: {
                color: '#3175c0',
                lineStyle: { // 系列级个性化折线样式
                    width: 5,
                    type: 'solid'
                },
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: 'rgba(49,117,192,.7)'
                    }, {
                        offset: 1,
                        color: 'rgba(11, 39, 79,.1)'
                    }])
                }
            }
        },
        data: dataAll[2]
    }, {
        name: '444444',
        type: 'line',
        symbol: 'circle',
        symbolSize: 20,
        xAxisIndex: 1,
        yAxisIndex: 1,
        itemStyle: {
            normal: {
                color: '#4b94491',
                lineStyle: { // 系列级个性化折线样式
                    width: 5,
                    type: 'solid'
                },
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: 'rgba(75,157,145,.7)'
                    }, {
                        offset: 1,
                        color: 'rgba(11, 39, 79,.1)'
                    }])
                }
            }
        },
        data: dataAll[3]
    }, {
        name: '444444',
        type: 'line',
        symbol: 'circle',
        symbolSize: 20,
        xAxisIndex: 2,
        yAxisIndex: 2,
        itemStyle: {
            normal: {
                color: '#4b94491',
                lineStyle: { // 系列级个性化折线样式
                    width: 5,
                    type: 'solid'
                },
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: 'rgba(75,157,145,.7)'
                    }, {
                        offset: 1,
                        color: 'rgba(11, 39, 79,.1)'
                    }])
                }
            }
        },
        data: dataAll[4]
    }]
};