📱
【Swift】【iPhone】Chartsライブラリを使用するサンプルコード
Chartsライブラリを使用するサンプルコード
ライブラリを使用するので
Podfileに下記を追記する。
pod 'DGCharts'
ライブラリをインストールする。
$ pod install
インストールが完了したら、XcodeでもDGChartsライブラリが確認できる。
折れ線グラフ
ChartViewController.swift
import UIKit
import DGCharts
class ChartViewController: UIViewController {
// チャート
var chartView: LineChartView!
// チャートデータ
var lineDataSet: LineChartDataSet!
// 折れ線グラフで表示するデータ(Y軸)
private let data: [Double] = [100.0, 65.0, 90.0, 30.0, 45.0]
override func viewDidLoad() {
super.viewDidLoad()
drawChart(y: data)
}
func drawChart(y: [Double]) {
// チャートビューのサイズと位置を定義
self.chartView = LineChartView(frame: CGRect(x: 0, y: 0, width: self.view.frame.width, height: 400))
chartView.center = self.view.center
// チャートに渡す用の配列を定義
var dataEntries: [ChartDataEntry] = []
// Y軸のデータリストからインデックスと値を取得し配列に格納
for (index, value) in y.enumerated() {
// X軸は配列のインデックス番号
let dataEntry = ChartDataEntry(x: Double(index), y: value)
dataEntries.append(dataEntry)
}
// 折れ線グラフ用のデータセット labelはグラフ名
lineDataSet = LineChartDataSet(entries: dataEntries, label: "グラフ名")
// グラフに反映
chartView.data = LineChartData(dataSet: lineDataSet)
// x軸のラベルをbottomに表示
chartView.xAxis.labelPosition = .bottom
// x軸のラベル数をデータの数にする
chartView.xAxis.labelCount = dataEntries.count - 1
self.view.addSubview(self.chartView)
}
}
棒グラフ
ChartViewController.swift
import UIKit
import DGCharts
class ChartViewController: UIViewController {
// チャート
var chartView: BarChartView!
// チャートデータ
var barDataSet: BarChartDataSet!
// 棒グラフで表示するデータ(Y軸)
private let data: [Double] = [100.0, 65.0, 90.0, 30.0, 45.0]
override func viewDidLoad() {
super.viewDidLoad()
drawChart(y: data)
}
func drawChart(y: [Double]) {
// チャートビューのサイズと位置を定義
self.chartView = BarChartView(frame: CGRect(x: 0, y: 0, width: self.view.frame.width, height: 400))
chartView.center = self.view.center
// チャートに渡す用の配列を定義
var dataEntries: [BarChartDataEntry] = []
// Y軸のデータリストからインデックスと値を取得し配列に格納
for (index, value) in y.enumerated() {
// X軸は配列のインデックス番号
let dataEntry = BarChartDataEntry(x: Double(index), y: value)
dataEntries.append(dataEntry)
}
// 棒グラフ用のデータセット labelはグラフ名
barDataSet = BarChartDataSet(entries: dataEntries, label: "グラフ名")
// グラフに反映
chartView.data = BarChartData(dataSet: barDataSet)
// x軸のラベルをbottomに表示
chartView.xAxis.labelPosition = .bottom
// x軸のラベル数をデータの数にする
chartView.xAxis.labelCount = dataEntries.count - 1
self.view.addSubview(self.chartView)
}
}
LineChart | BarChartView |
---|---|
Discussion