How to Set a Scrollable SwiftUI Chart to Show the Latest Data by Default

Learn how to configure SwiftUI Charts to display the latest portion of your data by default, enabling horizontal scrolling from the end of your dataset.
---
This video is based on the question https://stackoverflow.com/q/79440937/ asked by the user 'JustMe' ( https://stackoverflow.com/u/11621469/ ) and on the answer https://stackoverflow.com/a/79441033/ provided by the user 'workingdog support Ukraine' ( https://stackoverflow.com/u/11969817/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.

Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: Looking for way to set a scrollable chart in SwiftUI Charts all the way to the end of the data

Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.

If anything seems off to you, please feel free to drop me a comment under this video.
---
The Problem

When creating scrollable charts in SwiftUI with large data sets, the default behavior is to show the start (earliest dates) of your dataset. If you have data spanning 1,000 days but only want to show a 90-day window, the chart initially shows days 1-90, requiring the user to scroll right to see the latest data.

The goal: start the chart view scrolled to the most recent 90 days (e.g., days 910-1000), allowing scrolling backward to older data.



Why This Happens

SwiftUI's Chart view with .chartScrollableAxes(.horizontal) by default anchors on the minimum x-value, showing the earliest data. Using .chartXVisibleDomain(length:) allows you to set the visible range's length but doesn’t control the starting offset.



The Solution: Use .chartScrollPosition(initialX:)

SwiftUI's Chart provides the .chartScrollPosition(initialX:) modifier, which lets you specify the initial scroll position on the X axis.

Implementation:

Calculate the maximum x-axis value (latest date) in your data.

Provide this max value to .chartScrollPosition(initialX:) alongside your .chartXVisibleDomain(length:).

[[See Video to Reveal this Text or Code Snippet]]

This will:

Set the visible domain length to 90 days.

Scroll the chart so the visible window is anchored at the latest day.



Complete Minimal Example

[[See Video to Reveal this Text or Code Snippet]]



Summary

Use .chartXVisibleDomain(length:) to set how many days are visible.

Use .chartScrollPosition(initialX:) to set the starting scroll position.

This combination allows the chart to show the most recent data by default and scroll backward.

This approach optimizes the user experience when viewing large timelines in SwiftUI Charts.