Swift Charts Examples

An overview of the different types of charts you can make with Swift Charts

image

Let’s start by recreating the different chart examples that Apple gave in these session screenshots.

Included Charts

  • Basis project setup
  • Simple Line chart
  • Line chart with lollipop
  • Heartbeat Chart
  • Simple Bar chart
  • Simple dual bar chart
  • Range Chart
  • Pyramid Chart
  • Area Chart
  • Range with Max and Min Chart
  • One dimensional bar
  • Heatmap Block Chart

Todo

  • Cumulative line Chart
  • Heartbeat range Chart
  • Distribution line + Point Chart
  • Scatter Chart
  • Funky Gradient Chart
  • Other Charts
  • Multi-language Support
  • Make all charts accessible

See the open issues if you think anything is missing from this list. You can also contact me on Twitter if you have any suggestions or feedback.

Chart Types

How to add a new chart

Each chart needs a preview chart as well as a detail view. The preview chart is used in the home screen of the app for easier navigation. Look at the Simple Chart Simple code to see what the format should be for the preview charts. On the detail view, make sure you add some customisation options in a separate section from the chart.

Source: https://developer.apple.com/videos/play/wwdc2022/10137/

Chart Types

Line Charts

Line Chart

Line Chart with Lollipop

Heart Beat / ECG Chart

Bar Charts

One Dimensional Bar

Pyramid

Single Bar

Two Bars

Area Charts

Area Chart

Other Charts

Customizable Heat Map

Range Chart

GitHub

View Github