Swift Charts
Implement or review bar, line, area, and specialty Swift Charts on iOS with axes, selection, scrolling, vectorized plots, and a structured review checklist.
Overview
Swift Charts is an agent skill for the Build phase that implements and reviews Swift Charts visualizations for iOS apps using marks, axes, selection, scrolling, and vectorized plots.
Install
npx skills add https://github.com/dpearson2699/swift-ios-skills --skill swift-chartsWhat is this skill?
- Bar, line, area, point, pie, and donut marks inside Chart containers
- Axis, scale, legend, and foregroundStyle grouping customization
- Selection and scrollable charts (iOS 17+) patterns
- Vectorized BarPlot, LinePlot, AreaPlot, PointPlot for large datasets (iOS 18+)
- Review checklist for heat maps, Gantt, stacked bars, sparklines, and threshold lines
- Structured review checklist section in SKILL.md
- Mark types span bar, line, area, point, pie, and donut
Adoption & trust: 1.8k installs on skills.sh; 713 GitHub stars; 3/3 security scanners passed (skills.sh audits).
What problem does it solve?
You need native iOS charts but axes, selection, scroll behavior, and vectorized plots are easy to get wrong or ship without accessibility review.
Who is it for?
Indie iOS developers building dashboards, fitness, finance, or analytics views with Swift Charts on iOS 17–26+.
Skip if: Cross-platform teams standardizing on React Native or Flutter charts only—this skill is Swift-native.
When should I use this skill?
Building bar, line, area, point, pie, or donut charts; adding selection, scrolling, or annotations; plotting with vectorized plots; or customizing axes, scales, legends, or specialized visualizations.
What do I get? / Deliverables
Your agent delivers Chart compositions with appropriate marks, scale modifiers, and checklist-reviewed patterns ready for TestFlight or App Store screens.
- Chart view implementations
- Axis and scale configuration
- Review-checklist-passed chart code
Recommended Skills
Journey fit
How it compares
SwiftUI Charts workflow skill with a review checklist, not a third-party charting library integration pack.
Common Questions / FAQ
Who is swift-charts for?
Solo builders shipping SwiftUI iOS apps who want agent-guided Swift Charts implementation, customization, and pre-ship review.
When should I use swift-charts?
During Build frontend when you add or refine bar, line, area, pie, scrollable, or vectorized charts, annotations, or specialty visualizations like Gantt or heat maps.
Is swift-charts safe to install?
It is local SwiftUI guidance without required network tools—review the Security Audits panel on this Prism page for the skill package before installation.
SKILL.md
READMESKILL.md - Swift Charts
# Swift Charts Build data visualizations with Swift Charts targeting iOS 26+. Compose marks inside a `Chart` container, configure axes and scales with view modifiers, and use vectorized plots for large datasets. See [references/charts-patterns.md](references/charts-patterns.md) for extended patterns, accessibility, and theming guidance. ## Contents - [Workflow](#workflow) - [Chart Container](#chart-container) - [Mark Types](#mark-types) - [Axis Customization](#axis-customization) - [Scale Configuration](#scale-configuration) - [Foreground Style and Encoding](#foreground-style-and-encoding) - [Selection (iOS 17+)](#selection-ios-17) - [Scrollable Charts (iOS 17+)](#scrollable-charts-ios-17) - [Annotations](#annotations) - [Legend](#legend) - [Vectorized Plots (iOS 18+)](#vectorized-plots-ios-18) - [Common Mistakes](#common-mistakes) - [Review Checklist](#review-checklist) - [References](#references) ## Workflow ### 1. Build a new chart 1. Define data as an `Identifiable` struct or use `id:` key path. 2. Choose mark type(s): `BarMark`, `LineMark`, `PointMark`, `AreaMark`, `RuleMark`, `RectangleMark`, or `SectorMark`. 3. Wrap marks in a `Chart` container. 4. Encode visual channels: `.foregroundStyle(by:)`, `.symbol(by:)`, `.lineStyle(by:)`. 5. Configure axes with `.chartXAxis` / `.chartYAxis`. 6. Set scale domains with `.chartXScale(domain:)` / `.chartYScale(domain:)`. 7. Add selection, scrolling, or annotations as needed. 8. For 1000+ data points, use vectorized plots (`BarPlot`, `LinePlot`, etc.). ### 2. Review existing chart code Run through the Review Checklist at the end of this file. ## Chart Container ```swift // Data-driven init (single-series) Chart(sales) { item in BarMark(x: .value("Month", item.month), y: .value("Revenue", item.revenue)) } // Content closure init (multi-series, mixed marks) Chart { ForEach(seriesA) { item in LineMark(x: .value("Date", item.date), y: .value("Value", item.value)) .foregroundStyle(.blue) } RuleMark(y: .value("Target", 500)) .foregroundStyle(.red) } // Custom ID key path Chart(data, id: \.category) { item in BarMark(x: .value("Category", item.category), y: .value("Count", item.count)) } ``` ## Mark Types ### BarMark (iOS 16+) ```swift // Vertical bar BarMark(x: .value("Month", item.month), y: .value("Sales", item.sales)) // Stacked by category (automatic when same x maps to multiple bars) BarMark(x: .value("Month", item.month), y: .value("Sales", item.sales)) .foregroundStyle(by: .value("Product", item.product)) // Horizontal bar BarMark(x: .value("Sales", item.sales), y: .value("Month", item.month)) // Interval bar (Gantt chart) BarMark( xStart: .value("Start", item.start), xEnd: .value("End", item.end), y: .value("Task", item.task) ) ``` ### LineMark (iOS 16+) ```swift // Single line LineMark(x: .value("Date", item.date), y: .value("Price", item.price)) // Multi-series via foregroundStyle encoding LineMark(x: .value("Date", item.date), y: .value("Temp", item.temp)) .foregroundStyle(by: .value("City", item.city)) .interpolationMethod(.catmullRom) // Multi-series with explicit series parameter LineMark( x: .value("Date", item.date), y: .value("Price", item.price), series: .value("Ticker", item.ticker) ) ``` ### PointMark (iOS 16+) ```swift PointMark(x: .value("Height", item.height), y: .value("Weight", item.weight)) .foregroundStyle(by: .value("Species", item.species))