🐛[BUG] Stacked bar chart - each stack isn't ordered

[knobelman]

I have this data for example: (It is ordered by 'siteName' and 'impact')

0: {impact: 8, count: 11, siteName: 'Pinkelectric', sum: 48}
1: {impact: 7, count: 14, siteName: 'Pinkelectric', sum: 48}
2: {impact: 5, count: 5, siteName: 'Pinkelectric', sum: 48}
3: {impact: 2, count: 18, siteName: 'Pinkelectric', sum: 48}
4: {impact: 9, count: 1, siteName: 'Yellowbook', sum: 44}
5: {impact: 8, count: 2, siteName: 'Yellowbook', sum: 44}
6: {impact: 6, count: 16, siteName: 'Yellowbook', sum: 44}
7: {impact: 3, count: 25, siteName: 'Yellowbook', sum: 44}
8: {impact: 9, count: 3, siteName: 'PC man', sum: 37}
9: {impact: 7, count: 14, siteName: 'PC man', sum: 37}
10: {impact: 5, count: 4, siteName: 'PC man', sum: 37}
11: {impact: 2, count: 16, siteName: 'PC man', sum: 37}
12: {impact: 9, count: 1, siteName: 'Green Hill', sum: 31}
13: {impact: 7, count: 12, siteName: 'Green Hill', sum: 31}
14: {impact: 3, count: 3, siteName: 'Green Hill', sum: 31}
15: {impact: 1, count: 15, siteName: 'Green Hill', sum: 31}
16: {impact: 6, count: 1, siteName: 'Hills', sum: 24}
17: {impact: 4, count: 14, siteName: 'Hills', sum: 24}
18: {impact: 2, count: 9, siteName: 'Hills', sum: 24}

The chart looks like this: Impact 9 is darkest, impact 0 is lightest - as you can see the order of some of the stacks doesn't match the data I'm providing Example: (7,9,3,1 should be 9,7,3,1)

Is there a way to change the order of each individual stack? (I'd want it in DESC order from left to right, by impact) Config:

    const chartConfig = {
        data: alertsBy,
        isStack: true,
        xField: 'count',
        yField: 'siteName',
        seriesField: 'impact',
        colorField: 'impact',
        color: ({impact}) => {
            return Constants.ImpactColors[Math.floor(impact)];
        },
        legend: false,
        xAxis: {
            label: {
                formatter: () => {
                    return null
                }
            },
            grid: {
                line: {
                    style: {
                        lineWidth: 0,
                        strokeOpacity: 0,
                    }
                }
            }
        },
        yAxis: {
            label: {
                formatter: () => {
                    return null
                }
            },
            line: {
                style: {
                    lineWidth: 0,
                    strokeOpacity: 0,
                }
            },
            tickLine: {
                length: 0
            }
        },
    });

[lxfu1]

xField is must be type string.

[xiaodian516]

xField is must be type string.

But in the official example, xField is not string: https://charts.ant.design/zh/examples/bar/stacked#basic