Skip to content

🐛 [BUG]堆叠柱状图,组内排序错乱 #3862

@zj-93

Description

@zj-93

🐛 Bug description [Please make everyone to understand it]

当2021,2022年都有 PICU(普外科) 时但它们在组内的位置不一样,这时候,即使先将数据排好序再渲染,组内排序也是错乱的、请问是否还有别的办法可以规避或解决这个问题

Image

import { Column } from '@antv/g2plot';
let list = [
{
"value": 1,
"dimensionList": [
{
"id": "14",
"value": "2021"
},
{
"id": "13",
"value": "ICU(口腔科)"
}
],
"quotaList": [
{
"id": "3ae8d90c-0157-404f-acbd-9019b064bbb8"
}
],
"field": "2021",
"name": "2021",
"parentCategory": null,
"category": "ICU(口腔科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2021",
"name": "2021",
"parentCategory": null,
"category": "ICU(中医科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2021",
"name": "2021",
"parentCategory": null,
"category": "ICU(妇科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2021",
"name": "2021",
"parentCategory": null,
"category": "心血管外科门诊",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2021",
"name": "2021",
"parentCategory": null,
"category": "ICU(耳鼻喉科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 2,
"field": "2021",
"name": "2021",
"parentCategory": null,
"category": "PICU(心胸外科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 2,
"field": "2021",
"name": "2021",
"parentCategory": null,
"category": "ICU(感染科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 2,
"field": "2021",
"name": "2021",
"parentCategory": null,
"category": "ICU(烧伤整形科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 3,
"field": "2021",
"name": "2021",
"parentCategory": null,
"category": "ICU(肿瘤科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 4,
"field": "2021",
"name": "2021",
"parentCategory": null,
"category": "ICU(产科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2022",
"name": "2022",
"parentCategory": null,
"category": "PICU(泌尿外科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2022",
"name": "2022",
"parentCategory": null,
"category": "全科医疗科",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2022",
"name": "2022",
"parentCategory": null,
"category": "ICU(妇科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2022",
"name": "2022",
"parentCategory": null,
"category": "ICU(耳鼻喉科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2022",
"name": "2022",
"parentCategory": null,
"category": "ICU(中医科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2022",
"name": "2022",
"parentCategory": null,
"category": "ICU(眼科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 1,
"field": "2022",
"name": "2022",
"parentCategory": null,
"category": "心血管外科门诊",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 2,
"field": "2022",
"name": "2022",
"parentCategory": null,
"category": "PICU(骨科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 2,
"field": "2022",
"name": "2022",
"parentCategory": null,
"category": "PICU(普外科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
},
{
"value": 3,
"field": "2022",
"name": "2022",
"parentCategory": null,
"category": "PICU(心胸外科)",
"rowKey": null,
"calcType": null,
"popSize": null,
"group": null,
"extValue": null,
"x": null
}
]

const stackedColumnPlot = new Column('container', {
data: list,
isStack: true,
xField: 'field',
yField: 'value',
seriesField: 'category',
label: {
// 可手动配置 label 数据标签位置
position: 'middle', // 'top', 'bottom', 'middle'
// 可配置附加的布局方法
layout: [
// 柱形图数据标签位置自动调整
{ type: 'interval-adjust-position' },
// 数据标签防遮挡
{ type: 'interval-hide-overlap' },
// 数据标签文颜色自动调整
{ type: 'adjust-color' },
],
},
});

stackedColumnPlot.render();

Metadata

Metadata

Assignees

No one assigned

    Labels

    BugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions