echarts图例显示不全,

问题遇到的现象和发生背景

设置echarts,后台传递数据,设置图像显示三个任务中的6个图例显示,但是只显示了第一个任务中的两个图例,后面两个任务不显示

问题相关代码,请勿粘贴截图

var myChart = echarts.init(document.querySelector(".box"));
// 指定图表的配置项和数据
var option = {
title: {
text: '项目实施进度表',
left: 10
},
legend: {
y: 'bottom',
data: ['计划结束时间', '实际结束时间'] //修改的地方1

    },
    grid: {
        containLabel: true,
        left: 20
    },
    xAxis: {
        type: 'time'
    },

    yAxis: {
        data:datatask
    },
    tooltip: {
        trigger: 'axis',
    },
    series: [
        {
            name: '计划开始时间',
            type: 'bar',
            stack: 'test1',
            itemStyle: {
                normal: {
                    color: 'rgba(0,0,0,0)'
                }
            },
            data: intime
        },
        {
            name: '计划结束时间',
            type: 'bar',
            stack: 'test1',
            itemStyle: {
                normal: {
                    color: '#F98563'
                }
            },
            data: outime
        },
        {
            name: '实际开始时间',
            type: 'bar',
            stack: 'test2',
            itemStyle: {
                normal: {
                    color: 'rgba(0,0,0,0)'
                }
            },
            data: pe_real_intime
        },
        {
            name: '实际结束时间',
            type: 'bar',
            stack: 'test2',
            itemStyle: {
                normal: {
                    color: '#A2E068'
                }
            },
            data: pe_real_outime
        }
    ]
}
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
运行结果及报错内容

img


图象只显示了下面两个柱子,上面任务的柱子不显示,但是能取值,能触发事件

我的解答思路和尝试过的方法
我想要达到的结果

图例显示完全

legend中的data只写了两条数据图例就显示了两个,可以这样改data: ['计划开始时间','计划结束时间', '实际开始时间','实际结束时间'],或者直接不写data会走默认从当前系列中获取