堆叠图图例颜色不对
#5949
Replies: 1 comment
-
看一下相关的文档:https://g2.antv.antgroup.com/manual/extra-topics/color#range, 使用 color scale range 去指定颜色。 |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
问题描述
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
平台
屏幕截图或视频(可选)
No response
补充说明(可选)
No response
Beta Was this translation helpful? Give feedback.
All reactions