こんにちは sohnishi です。
今回はSwiftのチャートライブラリ【ios-charts】を使ってみたいと思います。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 |
import UIKit import Charts class ViewController: UIViewController { // チャート var chartView: LineChartView! // チャートデータ var lineDataSet: LineChartDataSet! override func viewDidLoad() { super.viewDidLoad() // y軸のプロットデータ(検証用) let plotDatas = [55.0, 100.0, 80.0, 100.0, 45.0] initDisplay(y: plotDatas) } func initDisplay(y: [Double]) { self.chartView = LineChartView(frame: CGRect(x: 0, y: (self.view.frame.height / 2) - 200, width: self.view.frame.width, height: 400)) // プロットデータ(y軸)を保持する配列 var dataEntries = [ChartDataEntry]() for (i, val) in y.enumerated() { let dataEntry = ChartDataEntry(x: Double(i), y: val) // X軸データは、0,1,2,... dataEntries.append(dataEntry) } lineDataSet = LineChartDataSet(entries: dataEntries, label: "") chartView.data = LineChartData(dataSet: lineDataSet) // x軸のラベルをボトムに表示 chartView.xAxis.labelPosition = .bottom // x軸のラベル数をデータの数に設定 chartView.xAxis.labelCount = dataEntries.count - 1 // タップでプロットを選択できないようにする chartView.highlightPerTapEnabled = false chartView.leftAxis.axisMaximum = 100 //y左軸最大値 chartView.leftAxis.axisMinimum = 0 //y左軸最小値 chartView.leftAxis.labelCount = 5 //y軸ラベルの表示数 chartView.leftAxis.drawTopYLabelEntryEnabled = true // y軸の最大値のみ表示 chartView.leftAxis.forceLabelsEnabled = true //最小最大値ラベルを必ず表示? chartView.rightAxis.enabled = false // Y軸右軸(値)を非表示 chartView.extraTopOffset = 25 // 上から20pxオフセット chartView.legend.enabled = false // 左下のラベル非表示 chartView.pinchZoomEnabled = false // ピンチズームオフ chartView.doubleTapToZoomEnabled = false // ダブルタップズームオフ // グラフアニメーション chartView.animate(xAxisDuration: 1.0, yAxisDuration: 1.0) // グラフの色 lineDataSet.colors = [UIColor.green] // プロットの色 lineDataSet.circleColors = [UIColor.red] // プロットの大きさ lineDataSet.circleRadius = 5.0 // 描画 self.view.addSubview(self.chartView) } } |
簡単にチャートを描画できました。
それでは。