Swift3.0 지원 CoreGraphics로 원형 차트 그리기

소개



Swift3에서 원형 차트 샘플을 만들었습니다.
이전에, 작성했습니다 Pie의 그리는 방법의 응용입니다.
Qiita Swift3.0 대응 CoreGraphics로 Pie를 그리기



원형 차트 그리기



PieChartView.swift
struct Segment {

    var color: UIColor
    var angle: CGFloat

}

원형 차트의 한 구분을 구조체로 나타냅니다. 색상과 각도를 지정합니다.

PieChartView.swift
var segments = [Segment]() {
        didSet {
            setNeedsDisplay()
        }
    }

위에서 설명한 구조체 "Segment"의 배열을 준비합니다.
값을 설정하면 다시 그리도록 하고 있습니다.
샘플에서는 ViewController에서 값을 설정합니다.

PieChartView.swift
private func drawPieChart(rect: CGRect) {
        // コンテキストを取得
        guard let context = UIGraphicsGetCurrentContext() else {
            return
        }

        // Pieの中心位置
        let center = CGPoint(x: rect.width * 0.5, y: rect.height * 0.5)

        // Pieの半径
        let radius = min(rect.width, rect.height) * 0.5

        // 開始角度(ラジアン) 右回りにするため-90度
        var startAngle = CGFloat(-90.0 * .pi/180)

        self.segments.forEach { (segment) in
            // Pieの色を設定
            context.setFillColor(segment.color.cgColor)

            // 終了角度(ラジアン) 右回りにするため-90度
            let endAngle = (segment.angle - 90.0) * .pi/180

            // 描画位置を移動
            context.move(to: center)

            // Pieを追加
            context.addArc(center: center, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: false)
            context.fillPath()

            startAngle = endAngle
        }
    }

구조체 "Segment"의 배열에서 하나씩 데이터를 검색하고 그리기 시작 각도와 끝 각도를 설정하여 Pie를 그립니다.

샘플



Github에 샘플 프로젝트를 올렸습니다.

Github PieChart

좋은 웹페이지 즐겨찾기