SwiftのライブラリのChartsを使って以下の様な時間に沿った円グラフを作ることは可能でしょうか？

Question

Swiftのグラフを描くライブラリの以下のChartsがありますがこれを使って、以下の画像の様に時間に沿ったグラフを描くにはどうすれば良いでしょうか？
https://github.com/danielgindi/Charts

以上の様に一番上が００：００で始まる様にしたいです。周りの時間表記は最悪なくてもいいですが少なくとも時間通りに表示したいです。
現在円グラフは以下の様に表示しています。

let dataSet = PieChartDataSet(values: [PieChartDataEntry(value: 3600, label: "A"), PieChartDataEntry(value: 6300, label: "B")], label: "Data")
        dataSet.setColors(UIColor.green, UIColor.blue)
        
        self.chartView.data = PieChartData(dataSet: dataSet)
        chartView.drawHoleEnabled = false
        chartView.legend.enabled = false
        
        self.view.addSubview(chartView)

以上の様にvalueに値を入れていく方法しか分からないのですが、円を塗る開始位置と終了位置を決めて塗れる様にすればできると思うのですが、そういった使い方はできるのでしょうか？
またもし他にもっと良い方法（Charts以外でもっと簡単にできるライブラリがある等)があればそれでも構わないので以上の様な円グラフを表示する方法を知りたいです。調べた所時計の様にして円を塗っていけるものはあまりなかった様な気がしました。。。

Answer 1

円を塗る開始位置と終了位置を決めて塗れる様に

これがちょっとよくわかりませんが、

以上の様にvalueに値を入れていく方法しか分からない

これはvalueを入れていく方法で合っています。

iOS-ChartsのPieChartはデフォルトの開始位置が時計で言う12時の位置だったと思います。なのでPieChartDataEntryに入れるvalueをトータル24時間だとか60x60x24秒で管理するようにすれば自然とHayato1201さんの思う形になるんじゃないかなと思います。

以下一例

    func makePieChart() {
        
        //夜11時に寝て朝8時起きの9時間寝て、1時間で朝の準備と出社、仕事が9時間、1時間で退社と夕飯、1時間まったりして、1時間トレーニング、1時間お風呂、1時間学習みたいな1日があったとして
        
        let array = [8, 1, 9, 1, 1, 1, 1, 1] // <=24時間
        
        let entries = array.map{ element -> PieChartDataEntry in
            let value = Double(element)
            return PieChartDataEntry(value: value)
        }
        //entriesは[PieChartDataEntry]

        let dataSet = PieChartDataSet(values: entries, label: "")
        dataSet.colors = ChartColorTemplates.colorful() //睡眠時間の色の調整は必要です
        let data = PieChartData(dataSet: dataSet)
        pieChart.data = data
        
    }

時間のLabelに関してはPieChartを入れるViewを用意して、そのViewに対してLabelのAutoLayoutで制約をかければ比較的簡単に実装できそうな気がします。

Comments

[Hayato1201]

回答ありがとうございます！確かにこれでできそうですが、arrayの合計が24にならない場合は空白ができると思います。上の実装だとその空白の時間がどこか分からないと思います。その為、円を塗る開始位置と終了位置を決めて塗れる様にできればその空白がどこになっているかがわかる様に作れるかと思ったのですが、何か他にも合計が24にならない時がわかる様な方法は無いでしょうか？？質問に載せた図だと、睡眠とトレーニング以外は色が付いていなくてその間空白である事がわかります。その様にしたいのですがどうすれば良いでしょうか。。。？

[xAxis]

上の例では分かりやすくarrayの要素をIntとしていますが時間をグラフ化する場合、必ず開始時刻と終了時刻が存在します。そして各々の値はDateの値として取るか、Dateに変換できる形で表現されたStringの値とBoolのセットの値で取るかします（基本前者だと思いますが）。

んで、
例えばステップAの開始時刻を9:00、終了時刻を12:00とします。
その次のステップBの開始時刻を14:00、終了時刻を17:00とします。

この二つのステップA、Bがそれぞれ何時間かかったかを計算するのはDateの値同士なら簡単です。firstDate.timeIntervalSince(someDate)とすれば二つのDateの値の差が取れます（firstDateとsomeDateは開始時刻と終了時刻と思ってください）。

上のやり方を少し応用すればその間の空白時間もDateの値同士なら同様に簡単です。
要するに開始時刻と終了時刻を計算するか、終了時刻と開始時刻を計算するかの違いでしかありません。Aの開始時刻とAの終了時刻を計算すればアクティビティにかかった時間が割り出せますし、Aの終了時刻とBの開始時刻を計算すれば空白の時間が割り出せます。
この考えを応用すればアクティビティや空白がいくつ合ってもarrayの合計を24にするのは可能だと分かるでしょう（若干面倒ですけどね）。ちなみに実際の実装には時間だけでなく分まで計算するので[Int}ではなく[Double]になります。

[Hayato1201]

ご丁寧な返信大変ありがとうございます。
ではやはりアクティビティの差分をとってその空白も１つのarrayにして表示するという事ですかね。
自分もそう思い時差を求める方法について質問していて、そちらにも回答してくださった様ですね。ありがとうございます。そちらに関してまだ疑問点があるので追記させていただくつもりですが、目を通して頂ければ幸いです。。。

[xAxis]

分かりました。もし私のわかる範囲でしたら遠慮なくどうぞ。