ApexCharts：分组条形图标签和系列

如何解决ApexCharts：分组条形图标签和系列

快速总结： 我一直在尝试构建一个顶点柱状图，显示针对目标的工作绩效，其中有两个分组的条形图，分别表示收入：预期/实际至今和成本：预期/实际至今。

这是我可以使用 ApexCharts 创建的图表：

这是我想要构建的（在 Excel 中模拟以进行演示）：

我很挣扎，因为我不确定我是否正确地应用了系列和组以获得我想要的结果。现在，它被设置为有两个系列，一个是预期的（具有收入和成本的预期值），第二个是实际的（同样具有收入和成本的实际值）。然后在 x 轴上，我创建了两个类别，称为收入和成本。

这是我的 javascript 代码：

var options = {
            series: [{
                    name: ['Expected'],data: [3025.00,2500.00]},{
                    name: ['Actual'],data: [896.00,625.00]}
                ],chart: {
                type: 'bar',height: 400
            },plotOptions: {
                bar: {
                    horizontal: true,dataLabels: {
                        position: 'top',},}
            },yaxis: {
                labels: {
                    formatter: function (value) {
                        if (isNaN(value)) {
                            return value;
                        } else {
                            var Formatter = new Intl.NumberFormat('en-US',{
                                style: 'currency',currency: 'USD'
                            });

                            return Formatter.format(value);
                        }
                    }
                }
            },dataLabels: {
                enabled: true,offsetX: -6,style: {
                    fontSize: '12px',colors: ['#fff']
                },formatter: function (val,opt) {
                    console.log(opt.w.globals);
                    var Formatter = new Intl.NumberFormat('en-US',currency: 'USD'
                            });

                    //return opt.w.globals.labels[opt.dataPointIndex] + ': ' + Formatter.format(val);
                    //return opt.w.globals.seriesNames[opt.seriesIndex] + ': ' + Formatter.format(val);
                    return Formatter.format(val);
                }
            },stroke: {
                show: true,width: 1,colors: ['#fff']
            },tooltip: {
                shared: true,intersect: false
            },xaxis: {
                categories: ["Revenue","Cost"],legend: {
                position: "bottom"
            },};

        var chart = new ApexCharts(document.querySelector("#apexJobChart"),options);
        chart.render();

如 Excel 图片所示，我希望每个组都有自己的预期和实际系列，我想在图表左侧显示这些标签（我尝试在条形图上显示绿色条尺寸太小）。我还希望颜色不同（我想我可以用颜色数组来做）来展示它们是如何不同的系列。

感谢任何指导。