2

I am trying to format the x axis values of a chart, where data is being generated in realtime. My X axis represent the seconds, while the Y axis represents the pressure. The chart works fine, but I have a dark background so the ValueLabels are hard to see.

                Chart {
                    ForEach(pressureData, id:\.self) { item in
                        LineMark(
                            x: .value("Time", item.date),
                            y: .value("Air Pressure", item.airPressure)
                        )
                    }
                }

I've been trying using the .chartXAxis modifier like so

                .chartXAxis {
                    AxisMarks(values: .automatic) { axisValue in
                            if let date = axisValue.as(Date.self) {
                                AxisValueLabel() {
                                    var hour = self.Calendar.current.component(.hour, from: date)
                                    var minute = self.Calendar.current.component(.minute, from: date)
                                    var second = self.Calendar.current.component(.second, from: date)
                                    var axisDate: Date = Calendar.current.date(from: .init(hour: hour, minute: minute, second: second))!
                                    Text("\(axisDate)")
                                        .foregroundColor(Color.white)
                                }
                            }
                        }
                    }

But aside from being unsuccessful, I think it's just way too much work to change the color of the ValueLabels. I am hoping there is an easier way to implement this change. Any help is appreciated, thanks!

GeorgeHTS
  • 41
  • 3
  • I'm having similar issues - I tried your code above and am getting "Type '() -> ()' cannot conform to 'StringProtocol'" – FontFamily Mar 02 '23 at 00:10

0 Answers0