"Swift Charts - Beyond the basics" by Cecilia Pesce and Erick Mitsugui Yamato

Ben Schneiderman once said “Visualization gives you answers to questions you didn’t know you had. “ That being said, since visualization lets the person comprehend great amounts of data in a better way it is important to know what to communicate to them.

A very effective way to represent data is by plotting it on a chart. Although Swift has since the beginning offered the possibility to do it, it was necessary to build geometric shapes on a view to plot the data, requiring extra work from developers. To be able to create a LineMark chart it was necessary to build a view which would use a computed property to calculate the highest point. Then a path type that moved to the first point was needed and to determinate the location of every point on the line the height would be multiplied by the ratio of the individual data point divided by the highest point. An iterator was necessary to reach the last point and to make it possible to connect each point with a line. That’s a significant amount of work to build a chart, hence Apple developed and launched at the WWDC22 the new framework called Swift Charts.

The new framework generates charts in a simpler and easier way, facilitates how to display more than one chart on the same view as BarMark with RuleMark, changes the labels from X and Y axes and enables the developer to explore many other possibilities with built-in functions. The days of setting geometric forms and connecting them with lines are left behind.

In order to show what Swift Charts is bringing to the table, we will present an Apple Watch app sample that we developed which gets the amount of steps from the last seven days from HealthKit and plots it in a BarMark chart.

We chose BarMark because in the words of (Evergreen, 2016) ¹ “Bar graphs are versatile, used for comparing magnitude, showing time series, ranking, part-to-whole, deviation and distribution.” And since we are working with the variation of a quantity of steps in a specific period of time, this is the kind of graph that suits the best.

The official Apple developer documentation states that “You can create different kinds of bar charts using the BarMark chart content. To create a simple vertical bar chart that plots categories with X positions and numbers with Y positions.”

The documentation also brings the possibility of customizing charts in many ways. For example, you can set the bar width, choose different legend symbols, and control the axes. ³
To have a better visualization, one of the properties used was chartXAxis, added to customize the X Axis label to display the narrow weekday date time format. The other property used was chartYAxis , which was included to customize the Y Axis label used to display the information in the left (leading) side.

“You can use RuleMark to plot a horizontal or vertical rule in your chart.” (Apple Developer Documentation)

To create RuleMark charts over the existing BarMark chart we had plotted, we added three different RuleMark methods, each one showing different data. The first one shows the daily steps count with X Axis using digitalCrownRotation , which allows the user to navigate with the digital crown along the X axis of the chart. The second one shows the steps goal that was previously set by the user and the last one the steps average from the last seven days.

The downside of Swift Charts is that it is only available from iOS 16+, iPadOS 16+, watchOS 9+, tvOS 16+, macOS 13+ and Mac Catalyst 16+.

#Swift #SwiftUI #WWDC22 #Framework #SwiftCharts #HealthKit #Charts #DataVisualization #Health #Wellness #Apple #AppDevelopment #Xcode #AppleWatch #iOS #watchOS #iPadOs #tvOS #macOS #MacCatalyst

---------

Visit Our Youtube Channel Here:
   / @swiftable  

Don't forget to like and subscribe.

Check Out Our Other Videos Here:
   • "Elevated Swift" by Soroush Khanlou  
   • "Hey Focus! How to get the most out o...  
   • "How to decrease your localization st...  

FIND US AT
https://www.swiftable.co

Get in Touch With Us:
Contact us at [email protected]

Follow Us on Social Media:
✅ Instagram:   / baswiftable  
✅ Twitter:   / baswiftable  
✅ Linkedin:   / swiftable