【Swift-Charts】X軸に1日ずつずらした日付を埋め込んだグラフを作りたい

Question

実現したいこと

折れ線グラフのX軸に日付を埋め込んで、X軸には「最初のデータから1日ずつ増やした日付」、Y軸には「日付に対応した個々の値」（対応する値がない場合はnullを代入）が入るようにしたいです。

イメージといたしましては以下のグラフのようにX軸には1週間ごとの日付をY軸には値を入れて、1週間ごとの記録でページを切り替える構造にしたいと考えています。

StudyPlusより参照いたしました。

試したこと

初心者ながら考えた方法としましては
①　データの中で日付が1番早いものと遅いものを取り出し、経過日数を計算する。
②　1番早い日付のものから遅い日付のものまで1日ずつ日付を加えていき、それをX軸の値として配列で保持
③　上記の日付に対応する値をY軸の値として配列として保持
（対応する値がない場合はnilを代入）
④　②③の値を使ってChartsでグラフを描画
⑤　データを1週間ごとに分け、それぞれにページを割り当てる
⑥　ボタンでページを切り替えることで1週間ごとのデータを順に表示させる
という流れで製作できるのではないかと思っているのですが、方法に自信がなく、より良い方法で作成する術があれば教えていただきたく質問させていただきました。

加えて上記①②の処理を下記のように行った際、アプリがとても重くなってしまいました。
下記のコードのどこが間違っているのかわからず、非常に困っています。
下のコードの誤りも重ねて教えていただけますと大変ありがたいです。

var calendar = Calendar(identifier: .gregorian)
var firstPost = points.first?.date
var lastPost = points.last?.date
//経過日数
var dateInterval: Int = Int(lastPost!.timeIntervalSince(firstPost!)) / (24 * 60 * 60)
//212
print(dateInterval)
var i = 0
repeat{
         date.append(Calendar.current.date(byAdding: .day, value: i, to: firstPost!))
         i += 1
} while i < dateInterval

拙い説明だと思いますがご教授いただけますと幸いです。

よろしくお願いいたします。

Comments

[hoshi-takanori]

コードが断片的でよく分かりません。その処理だけならそんなに遅くはないのでは。(同じ値をたくさん追加してるだけな気もしますが…)

[botamoti]

コードのこの箇所を変更した際に処理が大きく重くなってしまったのですが、原因は違うところにありそうですね。他の場所を検討してみます！ご教授くださりありがとうございます！「同じ値をたくさん追加してしまっている」と示していただいた箇所は「i」とすべきところを1と誤入力してしまっていたようです。こちらも気付いてくださりありがとうございます。

Answer 1

という流れで製作できるのではないかと思っているのですが、方法に自信がなく、より良い方法で作成する術があれば教えていただきたく質問させていただきました。

Charts はあまり使ったことがないのですが、
大まかな方針は良さそうに思いました。

画面構成やデータの性質によっては、
都度1週間分のグラフ用のデータを作る感じにしてみても良いのかなと思いました。
(質問欄のイメージは最初に全部の元データからグラフ用のデータをまとめて作る感じですよね)

---

加えて上記①②の処理を下記のように行った際、アプリがとても重くなってしまいました。
下記のコードのどこが間違っているのかわからず、非常に困っています。
下のコードの誤りも重ねて教えていただけますと大変ありがたいです。

どのくらいの時間がかかっているのか、
具体的な数値も質問欄にご記載いただくと良いと思いました。
(遅い、遅くない、は多少主観もあると思いますので、数値で表現してあげると、回答する人も判断しやすいかなと思いました)

dateを他で使っていない状態で、
手元で確認したところ、
date.append()
が遅いようでした。
(コメントに「コードのこの箇所を変更した際に処理が大きく重くなってしまった」との記載がありましたので、他の状況はおいておいて、このコードの部分についてだけ見た場合で書いています)

1400回程度のループで3秒もかかりました。
dateの配列が大きい場合、appendするのにさらに時間がかかるようで、
初期の要素に100000件を設定しておいた状態で確認すると、
1要素追加するだけでも体感的に0.5秒程度もかかっている感じでした(200要素追加するとしたら100秒もかかりますね)(遅いので計測はしませんでした)。
(質問欄のコードにdateの初期値やdateのクリア処理が記載されていないので実際のところはわからないですが、クリアしないまま要素を追加し続けると、どんどん遅くなりそうに思いました)

以下、XcodeのPlaygroundで確認したコードです。
(ご自身でもPlaygroundを使って値を変えながら動かしてみると他にもわかることがあるかもしれませんね)

struct Point {
    let date: Date
}
let dateFormatter = DateFormatter()
dateFormatter.dateStyle = .medium
dateFormatter.timeStyle = .none
dateFormatter.locale = Locale(identifier: "ja_JP")
let points: [Point] = [
    Point(date: dateFormatter.date(from: "2019/03/19")!),
    Point(date: dateFormatter.date(from: "2023/03/25")!),
]
var date: [Date] = (0..<100000).map({ _ in Date() })

func work() {
    var calendar = Calendar(identifier: .gregorian)
    var firstPost = points.first?.date
    var lastPost = points.last?.date
    //経過日数
    var dateInterval: Int = Int(lastPost!.timeIntervalSince(firstPost!)) / (24 * 60 * 60)
    //212
    print(dateInterval)
    var i = 0
    repeat {
        date.append(Calendar.current.date(byAdding: .day, value: i, to: firstPost!)!)
        i += 1
    } while i < dateInterval
    
    // 参考：appendせずに配列を生成すると(データ量にもよりますが)少しは速くなると思います
//    let array = (0..<dateInterval).map({
//        calendar.date(byAdding: .day, value: $0, to: firstPost!)!
//    })
}

// 処理時間計測
let clock = ContinuousClock()
let elapsed = clock.measure(work)
print(elapsed)

Comments

[botamoti]

ご回答くださりありがとうございます。非常に丁寧に説明してくださり大変助かりました！ベストアンサーにさせていただきます。
1週間ごとのデータを必要に応じて入れ替えて処理する。その際にappendせずに配列を生成し、データのクリア処理を導入することを試してみます！