diff --git a/common/changes/@visactor/vchart/fix-crosshair-size-of-point-scale_2025-04-18-07-46.json b/common/changes/@visactor/vchart/fix-crosshair-size-of-point-scale_2025-04-18-07-46.json new file mode 100644 index 0000000000..f5e6bd1a43 --- /dev/null +++ b/common/changes/@visactor/vchart/fix-crosshair-size-of-point-scale_2025-04-18-07-46.json @@ -0,0 +1,11 @@ +{ + "changes": [ + { + "comment": "fix: fix coordinate of rect crosshair when bandSize is 0, fix #3907\n\n", + "type": "none", + "packageName": "@visactor/vchart" + } + ], + "packageName": "@visactor/vchart", + "email": "dingling112@gmail.com" +} \ No newline at end of file diff --git a/packages/vchart/src/component/crosshair/utils/cartesian.ts b/packages/vchart/src/component/crosshair/utils/cartesian.ts index 3cd41f7bdc..129433c848 100644 --- a/packages/vchart/src/component/crosshair/utils/cartesian.ts +++ b/packages/vchart/src/component/crosshair/utils/cartesian.ts @@ -222,17 +222,17 @@ export const layoutCrosshair = (stateItem: CrossHairStateItem) => { end: { [coordKey]: pos, [anotherAxisKey]: sizeRange[1] } }; } else if (type === 'rect') { - const extend = getRectSize(attributes, bandSize, cacheInfo.axis); + const [offset0, offset1] = getRectSize(attributes, bandSize, offsetSize, cacheInfo.axis); const { coordRange } = cacheInfo; positionAttribute = { visible: true, start: { - [coordKey]: Math.max(coord - extend / 2 - offsetSize / 2, coordRange[0]), + [coordKey]: Math.max(coord + offset0, coordRange[0]), [anotherAxisKey]: sizeRange[0] }, end: { - [coordKey]: Math.min(coord + bandSize + extend / 2 + offsetSize / 2, coordRange[1]), + [coordKey]: Math.min(coord + offset1, coordRange[1]), [anotherAxisKey]: sizeRange[1] } }; @@ -241,17 +241,20 @@ export const layoutCrosshair = (stateItem: CrossHairStateItem) => { return positionAttribute; }; -const getRectSize = (hair: IHair, bandSize: number, axis: IAxis) => { +const getRectSize = (hair: IHair, bandSize: number, offsetSize: number, axis: IAxis) => { // 外部设置的size - let extend = 0; + const visualSize = bandSize === 0 ? offsetSize : bandSize; + let size = visualSize; + if (hair.style?.sizePercent) { - extend = (hair.style.sizePercent - 1) * bandSize; + // 按照百分比设置大小 + size = visualSize * hair.style.sizePercent; } else if (typeof hair.style?.size === 'number') { - extend = hair.style.size - bandSize; + size = hair.style.size; } else if (typeof hair.style?.size === 'function') { const axisRect = axis.getLayoutRect(); - extend = hair.style.size(axisRect, axis) - bandSize; + size = hair.style.size(axisRect, axis); } - return extend; + return bandSize === 0 ? [-size / 2, size / 2] : [bandSize / 2 - size / 2, size / 2 + bandSize / 2]; };