柱状图问题 #5713

提交好几次了 能准确回复吗 搞不定啊 提交好几次了 能准确回复吗 搞不定啊 提交好几次了 能准确回复吗 搞不定啊

想实现柱状图分组功能 像这样的

我现在的效果是这样的 这怎么成这样了

代码 var chart = new G2.Chart({ container: 'g2-ri', autoFit: true, // paddingTop: 0, // paddingBottom: 10, // paddingRight: 10 });

        chart
            .interval()
            .data({
                type: 'inline',
                value: this.zhuData.RiProfit,
                transform: [
                    {
                        type: 'fold',
                        fields: ['date_times', 'ps_sale_total_price', 'cost_money', 'lirun_price'],
                        // key: 'key',
                        // value: 'value',
                    },
                ],
            })
            .transform({ type: 'sortX', by: 'y', reverse: true, slice: 6 })
            .transform({ type: 'dodgeX' })
            .encode('x', 'date_times')
            .encode('y', 'ps_sale_total_price')
            .encode('color', 'ps_sale_total_price')
            .scale('y', { nice: true })
            .axis('y', { labelFormatter: '~s' });

        chart
            .interaction('tooltip', { shared: true })
            .interaction('elementHighlightByColor', { background: true });

        chart.render();

数据是 [ { "date_times": "2023-10-01", "ps_sale_total_price": 0, "cost_money": 0, "lirun_price": 0 }, { "date_times": "2023-10-02", "ps_sale_total_price": 0, "cost_money": 0, "lirun_price": 0 }, { "date_times": "2023-10-03", "ps_sale_total_price": 0, "cost_money": 0, "lirun_price": 0 }, { "date_times": "2023-10-04", "ps_sale_total_price": 0, "cost_money": 0, "lirun_price": 0 } ]

需要把每个日期下面 ps_sale_total_price cost_money lirun_price 这三个字段分为一组 搞不定了啊 帮帮忙感谢了