Skip to content

[Insights] Fix victory-native hiding rotated labels near chart edges #80970

Description

@mateuuszzzzz

If you haven't already, check out our contributing guidelines and patch guidelines for information on how to manage patches.


Patch Information

Library Name: victory-native
Library Version: 41.20.2
Patch Number: 001
Patch Description: fix-rotated-label-bounds-check
Full Patch Filename: victory-native+41.20.2+001+fix-rotated-label-bounds-check.patch

Patch Details

Reason for Patch

Victory Native's XAxis component calculates label bounds using the unrotated text width, even when labelRotate is specified. This causes labels near the chart edges to be incorrectly hidden when rotated.

For example, at 90° rotation the actual horizontal extent of a label is just the font height (~14px), but Victory's bounds check uses the full unrotated text width (which could be 50-100px+). This results in labels being hidden even though they would visually fit within the chart area.

Changes Made

In src/cartesian/components/XAxis.tsx, the canFitLabelContent bounds check now uses the actual horizontal extent of rotated labels instead of the unrotated text width. The rotated width is calculated using the formula:

rotatedWidth = textWidth * |cos(angle)| + fontSize * |sin(angle)|

A new rotatedLabelX position is derived from this width for the bounds check, while the original labelWidth and labelX are preserved for positioning and rotation origin calculations.

Upstream Status

Upstream PR/Issue: TBD

Related Information

PR Introducing Patch: #80967

Additional Notes

This patch only affects the bounds check logic (canFitLabelContent). Label positioning, rotation origin, and all other rendering behavior remain unchanged. The fix is backwards-compatible — when labelRotate is 0 (default), cos(0) = 1 and sin(0) = 0, so rotatedLabelWidth equals the original labelWidth.

Checklist

  • Patch file is correctly named and placed in the appropriate directory
  • Patch is documented in the corresponding details.md file
  • This issue is linked in the details.md file
  • Upstream PR/issue has been created (if applicable)

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Labels

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions