第 38 章
利用 Charts 框架建立圖表

你不再需要建立自己的圖表庫或依賴第三方庫來建立圖表。 SwiftUI 框架現在附帶圖表 API。 借助 iOS 16 或更高版本中提供的這個圖錶框架，只需幾行程式碼即可呈現動畫圖表。

建立簡單的長條圖

簡單來說，我們只需要定義 Mark，就可以構建出 SwiftUI 圖表。讓我們看看這個簡單的例子：

import SwiftUI
import Charts

struct ContentView: View {
    var body: some View {
        Chart {
            BarMark(
                x: .value("Day", "Monday"),
                y: .value("Steps", 6019)
            )

            BarMark(
                x: .value("Day", "Tuesday"),
                y: .value("Steps", 7200)
            )
        }
    }
}

無論我們想要構建長條圖還是折線圖，我們都會從 Chart 視圖開始。在圖表裡面，我們可以定義 bar mark，來提供圖表資料。BarMark 視圖是用來構建長條圖的，每一個 BarMark 視圖都會有 x 和 y 值，x 值就是代表 x 軸的圖表資料，如此類推。在以上的程式碼中，我把 x 軸的標籤設置為 Day，而 y 軸就是總步數。

讓我們在 Xcode 輸入以上程式碼，預覽就會自動顯示有兩個垂直長方體的長條圖。

以上就是創建長條圖最簡單的方法。不過，我們通常都不會對圖表數據進行硬編碼 (hardcode)，而是在 Charts API 編寫一組數據。讓我們看看以下例子：

想更深入學習SwiftUI和下載完整程式碼？你可以從 AppCoda網站購買《精通 SwiftUI》完整電子版。