swift - How to set axis order in AxisMarks in SwiftUI Chart view - Stack Overflow

时间: 2025-01-06 admin 业界

My app displays a chart using LineMarks. I want my Y axis to have at the bottom 0, and at the top 15. Like this: Correct Y axis This works fine unless all the values are 0, in which case the Y axis is inversed: Inversed Y axis

Chart {
                ForEach(manager.data) {
                    LineMark(
                        x: .value("Date", $0.date),
                        y: .value("Count", $0.value)
                    )
                    .symbol {
                        Circle()
                            .frame(width: 5, height: 5)
                    }
                }
            }
            .chartXAxis {
                AxisMarks(preset: .aligned , values: manager.last15days) { value in
                    if ((value.index+1) % 3 == 0 || value.index == 0) {
                        let date = manager.last15days[value.index]
                        let stringFormatted = manager.formatter.string(from: date)
                        AxisValueLabel(stringFormatted)
                            .offset(y: 10)
                    }
                }
            }
            .chartYAxis {
                    let values = [0, 3, 6, 9, 12, 15]
                    AxisMarks(values: values) { value in
                        AxisValueLabel("\(values[value.index])").offset(x: 15)
                        AxisGridLine()
                    }
            }
            .listRowBackground(Color.clear)
            .foregroundStyle(Color(.blue))
            .frame(height: 300)
            .padding()

I tried reversind the values array to this: let values = [15, 12, 9, 6, 3, 0] and it did not work.

My app displays a chart using LineMarks. I want my Y axis to have at the bottom 0, and at the top 15. Like this: Correct Y axis This works fine unless all the values are 0, in which case the Y axis is inversed: Inversed Y axis

Chart {
                ForEach(manager.data) {
                    LineMark(
                        x: .value("Date", $0.date),
                        y: .value("Count", $0.value)
                    )
                    .symbol {
                        Circle()
                            .frame(width: 5, height: 5)
                    }
                }
            }
            .chartXAxis {
                AxisMarks(preset: .aligned , values: manager.last15days) { value in
                    if ((value.index+1) % 3 == 0 || value.index == 0) {
                        let date = manager.last15days[value.index]
                        let stringFormatted = manager.formatter.string(from: date)
                        AxisValueLabel(stringFormatted)
                            .offset(y: 10)
                    }
                }
            }
            .chartYAxis {
                    let values = [0, 3, 6, 9, 12, 15]
                    AxisMarks(values: values) { value in
                        AxisValueLabel("\(values[value.index])").offset(x: 15)
                        AxisGridLine()
                    }
            }
            .listRowBackground(Color.clear)
            .foregroundStyle(Color(.blue))
            .frame(height: 300)
            .padding()

I tried reversind the values array to this: let values = [15, 12, 9, 6, 3, 0] and it did not work.

Share Improve this question asked yesterday mparismparis 32 bronze badges New contributor mparis is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct.
Add a comment  | 

1 Answer 1

Reset to default 0

Setting the Y axis domain fixes this issue.

.chartYScale(domain: 0...15)

Make sure to use a range that includes all the y values. [0, 3, 6, 9, 12, 15] are just the axis labels you want, whereas the domain is the whole range of y values that you want to display.