堆叠图图例颜色不对

[YY88Xu]

问题描述

import { Chart } from '@antv/g2';

const chart = new Chart({
container: 'container',
autoFit: true,
});
const data = [
{
"month": "2023年1月",
"label": "R4",
"value": 10,
color: 'red',
},
{
"month": "2023年1月",
"label": "R5",
"value": 30,
color: 'yellow',
},
{
"month": "2023年1月",
"label": "R6",
color: 'green',
"value": 32
},
{
"month": "2023年2月",
"label": "R4",
color: 'red',
"value": 10
},
{
"month": "2023年2月",
"label": "R5",
color: 'yellow',
"value": 60
},
{
"month": "2023年2月",
"label": "R6",
color: 'green',
"value": 40
},
]
chart
.interval()
.data(data)
.transform({ type: 'stackY' })
.transform({ type: 'sortX', by: 'y', reverse: true })
.encode('x', 'month')
.encode('y', 'value')
.encode('color', 'color')
.style('fill', d => d.color)
.transform({ type: 'stackY' })
.transform({ type: 'normalizeY' })

chart.render();

重现链接

No response

重现步骤

图例上颜色不对

预期行为

No response

平台

• 操作系统: [macOS, Windows, Linux, React Native ...]
• 网页浏览器: [Google Chrome, Safari, Firefox]

屏幕截图或视频（可选）

No response

补充说明（可选）

No response

[pearmini]

看一下相关的文档：https://g2.antv.antgroup.com/manual/extra-topics/color#range， 使用 color scale range 去指定颜色。