gikoha’s blog

個人的メモがわり

ChartExample

SwiftでChartsを書く練習

 参考:

Creating a Line Chart in Swift and iOS - Osian Smith - Medium

 

まずXcodeを立ち上げる

新規Cocoaプロジェクト>Swiftで ChartExampleプロジェクトを作成

参考ページではcocoapodsが入っていることが前提だったが入っていなかったのでインストール

"sudo gem install cocoapods"

terminalでChartExmapleのdirectoryに移動後、"pod init"

そこにあるPodfileを編集, "pod 'Charts'"という行を付け加える

再度 terminalから、"pod install"でダウンロード&インストール

f:id:gikoha:20190909202755p:plain

そしてChartExample.xcworkspaceファイルを開き直すとChartExampleに加えてPodsというプロジェクトも含まれてくる

f:id:gikoha:20190909202821p:plain

Main.storyboardをWクリックして編集、いくつかのアイテムを追加する グラフのところはCustom Viewを置く

f:id:gikoha:20190909203315p:plain

 Custom Viewのクラス名をBarChartViewに変更

f:id:gikoha:20190909203357p:plain

右上のリンクボタン(下の図の真ん中の2つの輪)をおして

f:id:gikoha:20190909205912p:plain

controlキーを押しながら、Text Fieldの中身をソースコードまでcontrol+ドラッグしてoutletを作る (下の図ではTextFieldCellになっているがそれじゃだめでTextFieldの方をドラッグしてね)

f:id:gikoha:20190909205830g:plain

同じようにAddボタンをcontrol+ドラッグしてactionを作る

f:id:gikoha:20190909210342g:plain

View Controllerにoutletコードを追加

f:id:gikoha:20190909215902p:plain
storyboardのView ControllerからCustom Viewへ同様にリンクを張ってoutletを接続

最後にボタンを押したときのコードを追加して終了

//
//  ViewController.swift
//  ChartExample
//
//  Created by Namikare Gikoha on 2019/09/09.
//  Copyright © 2019 Namikare Gikoha. All rights reserved.
//
import Foundation
import Cocoa
import Charts

class ViewController: NSViewController {
    @IBOutlet weak var value: NSTextField!
    @IBOutlet weak var chart: BarChartView!
    
    var numbers : [Double] = []
    
    override func viewDidLoad() {
        super.viewDidLoad()

        // Do any additional setup after loading the view.
    }

    override var representedObject: Any? {
        didSet {
        // Update the view, if already loaded.
        }
    }

    @IBAction func addAction(_ sender: Any) {
        let hoge = Double(value.stringValue)
        numbers.append(hoge!)
        updateGraph()
    }
    
    func updateGraph()
    {
        var barChartEntry  = [BarChartDataEntry]()
        for i in 0..<numbers.count
        {
            let value = BarChartDataEntry(x: Double(i), y: numbers[i])
            barChartEntry.append(value)
        }
        
        let bar1 = BarChartDataSet(entries: barChartEntry, label: "Data")
        
        let data = BarChartData()
        
        data.addDataSet(bar1)
        
        chart.data = data
        chart.chartDescription?.text = "Test"
    }
}

(上記は"highlight ViewController.swift -O html --font=Menlo --inline-css -f --enclose-pre --style=github | pbcopy")で記事を作成して貼り付けた

こんな感じになりました

f:id:gikoha:20190909221719p:plain