[Bug] 瀑布图 负值柱子方向异常

リンクされた最小再現を開き、その waterfall レンダリングを提供されたデータと比較します。特に、値 -4993 と -34、およびそれらの isNegative マーカーを確認してください。まず、VChart 2.1.1 と示されている waterfall 設定で再現します。負の値の列が意図した方向にレンダリングされ、正の値の列と合計列にリグレッションがない状態を完了とします。

Version

2.1.1

Link to Minimal Reproduction

https://www.visactor.com/vchart/chartPage?specId=8198614942&timestamp=1783066440104&version=2.0.19&theme=light

Steps to Reproduce

const spec = {
"hover": {
"dimension": {
"enable": true
}
},
"__isSeriesWithinPointsSpec": true,
"__innerSpecType": "IWaterfallSpec",
"__configChartType": "waterfall",
"type": "waterfall",
"data": [
{
"id": "allData",
"values": [
{
"group": "_3xj1kmdtu",
"groupAlias": "正值",
"index": 0,
"name": "Nomination Estimate",
"labelValue": "-4993",
"seriesIndex": 0,
"dataIndex": 0,
"value": -4993,
"valueAxis": "value0",
"waterfall-value0": -4993,
"unStackIndex": "0"
},
{
"group": "_3xj1kmdtu",
"groupAlias": "正值",
"index": 1,
"name": "△ Nomination",
"labelValue": "482",
"seriesIndex": 0,
"dataIndex": 1,
"value": 482,
"valueAxis": "value0",
"waterfall-value0": 482,
"unStackIndex": "1"
},
{
"group": "_3xj1kmdtu-negative",
"groupAlias": "负值",
"index": 2,
"name": "△ P-data",
"labelValue": "-34",
"seriesIndex": 0,
"dataIndex": 2,
"value": -34,
"valueAxis": "value0",
"waterfall-value0": -34,
"originGroup": "_3xj1kmdtu",
"isNegative": true,
"unStackIndex": "2"
},
{
"group": "_3xj1kmdtu",
"groupAlias": "正值",
"index": 3,
"name": "△ ECR",
"labelValue": "20",
"seriesIndex": 0,
"dataIndex": 3,
"value": 20,
"valueAxis": "value0",
"waterfall-value0": 20,
"unStackIndex": "3"
},
{
"group": "_3xj1kmdtu-total",
"groupAlias": "小计",
"index": 3,
"name": "小计",
"labelValue": "5461",
"seriesIndex": 0,
"dataIndex": 3,
"value": 5461,
"valueAxis": "value0",
"waterfall-value0": 5461,
"isTotal": true,
"originGroup": "_3xj1kmdtu",
"unStackIndex": "4"
}
],
"fields": {
"group": {
"domain": [
"_3xj1kmdtu",
"_3xj1kmdtu-negative",
"_3xj1kmdtu-total"
]
}
}
}
],
"xField": "unStackIndex",
"yField": "value",
"seriesField": "group",
"stack": false,
"total": {
// "type": "custom",
"tagField": "isTotal"
},
"stackLabel": {
"visible": false
},
"legends": {
"orient": "bottom",
"position": "middle",
"noOuterPadding": false,
"item": {
"spaceCol": 30,
"spaceRow": 8,
"background": {
"visible": false,
"style": {
"cursor": "default"
},
"state": {
"hover": {
"cursor": "default"
},
"unSelected": {
"cursor": "default"
}
}
},
"label": {
"style": {
"cursor": "default",
"fill": "rgba(46, 47, 50, 0.8)"
},
"state": {
"selectedHover": {
"opacity": 1
},
"unSelected": {
"fill": "rgb(187, 191, 196)",
"fillOpacity": 1,
"cursor": "default"
},
"hover": {
"cursor": "default"
}
}
},
"shape": {
"space": 16,
"style": {
"symbolType": "square",
"cursor": "default",
"size": 10,
"outerBorder": {
"stroke": "#dee0e3",
"lineWidth": 1,
"distance": 1.5
}
},
"state": {
"selectedHover": {
"opacity": 1
},
"unSelected": {
"fill": "rgb(187, 191, 196)",
"fillOpacity": 1,
"cursor": "default"
},
"hover": {
"cursor": "default"
},
"unSelectedHover": {}
}
},
"padding": 0,
"maxWidth": "100%",
"value": {
"style": {
"cursor": "default"
},
"state": {
"hover": {
"cursor": "default"
},
"unSelected": {
"cursor": "default"
}
}
}
},
"pager": {
"textStyle": {
"fillOpacity": 0,
"fontSize": 1
},
"offsetY": -1,
"handler": {
"style": {
"size": 10,
"fillOpacity": 1,
"fill": "#646a73"
},
"state": {
"hover": {
"fill": "rgba(31,35,41,0.1)",
"cursor": "pointer"
},
"disable": {
"fill": "#bbbfc4"
}
},
"preShape": "M10.8536 8.14645C10.6583 8.34171 10.3417 8.34171 10.1464 8.14645L6 4L1.85355 8.14645C1.65829 8.34171 1.34171 8.34171 1.14645 8.14645C0.951185 7.95119 0.951185 7.6346 1.14645 7.43934L5.29289 3.29289C5.68342 2.90237 6.31658 2.90237 6.70711 3.29289L10.8536 7.43934C11.0488 7.6346 11.0488 7.95119 10.8536 8.14645Z",
"nextShape": "M1.14645 3.85355C1.34171 3.65829 1.65829 3.65829 1.85355 3.85355L6 8L10.1464 3.85355C10.3417 3.65829 10.6583 3.65829 10.8536 3.85355C11.0488 4.04881 11.0488 4.3654 10.8536 4.56066L6.70711 8.70711C6.31658 9.09763 5.68342 9.09763 5.29289 8.70711L1.14645 4.56066C0.951184 4.3654 0.951184 4.04882 1.14645 3.85355Z"
},
"space": 12,
"padding": 0,
"width": 22,
"height": 10,
"layout": "horizontal"
},
"maxCol": 1,
"_legendHoverReverseEnabled": true,
"select": false,
"type": "discrete",
"visible": true,
"padding": {
"top": 16,
"left": 0,
"bottom": 8,
"right": 0
}
},
"tooltip": {
"mark": {
"title": {},
"content": {}
},
"dimension": {
"title": {},
"content": {},
"maxLineCount": null
}
},
"waterfall": {
"state": {
"legend_hover_reverse": {
"opacity": 0.4
}
}
},
"label": {
"syncState": true,
"state": {
"legend_hover_reverse": {
"opacity": 0.4
}
},
"visible": true,
"style": {
"strokeOpacity": 0,
"fontFamily": "LarkHackSafariFont, LarkEmojiFont, LarkChineseQuote,-apple-system, BlinkMacSystemFont, Helvetica Neue PingFang SC,Microsoft Yahei, Arial, Hiragino Sans GB, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji""
},
"offset": 6,
"smartInvert": {
"mode": "WCAG",
"fillStrategy": "invertBase",
"interactInvertType": "inside"
},
position:'inside-top',
"overlap": {
"hideOnHit": false,
"clampForce": false,
"strategy": [
{
"type": "bound",
"position": [
"top"
],
"restorePosition": false
},
{
"type": "moveY",
"offset": [
-4,
-8,
-20,
-24,
-28,
-32,
-36,
-40
]
},
{
"type": "bound",
"position": [
"bottom"
],
"restorePosition": false
},
{
"type": "moveY",
"offset": [
4,
8,
20,
24,
28,
32,
36,
40
]
}
]
}
},
"axes": [
{
"orient": "bottom",
"trimPadding": false,
"label": {
"labelPadding": 12,
"flush": false,
"labelColor": "#1f2329",
"space": 12,
"visible": true,
"autoHide": true,
"style": {
"fontSize": 12,
"fill": "#1f2329",
"fontFamily": "LarkHackSafariFont, LarkEmojiFont, LarkChineseQuote,-apple-system, BlinkMacSystemFont, Helvetica Neue PingFang SC,Microsoft Yahei, Arial, Hiragino Sans GB, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji""
},
"autoRotateAngle": [
0,
-45,
-90
],
"autoRotate": true,
"autoLimit": true
},
"interactive": true,
"domain": [
0,
1,
2,
3,
4
],
"title": {
"style": {
"fill": "#1f2329",
"textAlign": "center"
},
"visible": false,
"text": "",
"space": 4
},
"grid": {
"visible": false,
"style": {
"stroke": "#bbbfc4",
"lineWidth": 0.5
},
"alignWithLabel": false
},
"tick": {
"visible": false,
"tickSize": 8,
"style": {
"lineWidth": 1,
"stroke": "#51565d"
}
},
"domainLine": {
"style": {
"stroke": "#51565d",
"lineWidth": 1
},
"visible": true
},
"density": 1.4,
"id": "waterfall-index-axis",
"seriesIndex": [
0
],
"type": "band",
"paddingOuter": 0.1,
"visible": true,
"sampling": false,
"range": {}
},
{
"orient": "left",
"label": {
"labelOverlap": "parity",
"labelPadding": 12,
"flush": false,
"labelColor": "#1f2329",
"visible": true,
"autoHide": true,
"style": {
"fontSize": 12,
"fill": "#1f2329",
"fontFamily": "LarkHackSafariFont, LarkEmojiFont, LarkChineseQuote,-apple-system, BlinkMacSystemFont, Helvetica Neue PingFang SC,Microsoft Yahei, Arial, Hiragino Sans GB, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji""
},
"autoRotateAngle": [
0
],
"autoRotate": true,
"autoLimit": true
},
"interactive": true,
"domain": true,
"title": {
"style": {
"fill": "#1f2329",
"textAlign": "center"
},
"visible": false,
"text": "",
"position": "middle",
"space": 4
},
"grid": {
"visible": true,
"style": {
"stroke": "#bbbfc4",
"lineWidth": 0.5
}
},
"tick": {
"visible": false,
"tickSize": 8,
"style": {
"lineWidth": 1,
"stroke": "#51565d"
}
},
"domainLine": {
"style": {
"stroke": "#51565d",
"lineWidth": 1
},
"visible": false
},
"density": 1.4,
"id": "waterfall-value-axis",
"seriesIndex": [
0
],
"type": "linear",
"visible": true,
"sampling": false,
"range": {}
}
],
"leaderLine": {
"visible": true,
"style": {
"stroke": "#646a73",
"strokeOpacity": 1,
"lineDash": [
6,
2
],
"lineWidth": 1
}
},
"color": {
"type": "ordinal",
"field": "group",
"domain": [
"_3xj1kmdtu",
"_3xj1kmdtu-negative",
"_3xj1kmdtu-total"
],
"range": [
"#5383f1",
"#55c6ef",
"#bbbfc4"
],
"specified": {
"_3xj1kmdtu": "#5383f1",
"_3xj1kmdtu-negative": "#55c6ef",
"_3xj1kmdtu-total": "#bbbfc4"
}
},
"bar": {
"style": {
"cursor": "pointer"
},
"state": {
"_ser_sel": {
"outerBorder": {
"stroke": "#4e83fd",
"lineWidth": 1,
"distance": 3
}
},
"_pt_sel": {
"outerBorder": {
"stroke": "#4e83fd",
"lineWidth": 1,
"distance": 3
}
}
}
},
"crosshair": {
"xField": {
"visible": true
}
},
"title": {
"padding": {
"top": -1
},
"visible": true,
"text": "BOM Cost变化趋势",
"textStyle": {
"cursor": "pointer",
"align": "center",
"lineClamp": 2,
"verticalDirection": "top",
"ellipsis": "...",
"wordBreak": "break-word",
"visible": true,
"fontSize": 16,
"lineHeight": 20,
"fill": "#1f2329",
"underline": 0,
"lineThrough": 0
},
"subtextStyle": {
"cursor": "pointer",
"align": "left",
"lineClamp": 2,
"verticalDirection": "top",
"ellipsis": "...",
"wordBreak": "break-word",
"visible": false,
"fill": "#8f959e",
"fontSize": 14,
"lineHeight": 18
}
},
"padding": {},
"theme": {
"colorScheme": {
"default": [
"#5383f1",
"#55c6ef",
"#bbbfc4"
]
}
},
"animation": true,
"animationUpdate": false,
"animationExit": false,
"animationEnter": false,
"animationDisappear": false
}

const vchart = new VChart(spec, { dom: CONTAINER_ID });
vchart.renderSync();

// Just for the convenience of console debugging, DO NOT COPY!
window['vchart'] = vchart;

Current Behavior

设置标签位置‘inside-top‘后，
负值柱子标签位置与正值柱子标签位置一致，
标签重叠时避让设置避让position:['top‘],正值柱子避让方向一致

Expected Behavior

设置标签位置‘inside-top‘后，
负值柱子标签位置与正值柱子标签位置相反，
标签重叠时设置避让position:['top'],负值柱子与正值柱子避让方向应该相反

Environment

- OS:mac
- Browser:google
- Framework:

Any additional comments?

No response