iosswiftswiftuiswiftui-charts

How to make char x axis label next to the barview in swiftui


I was trying to get y labels next the barview in swiftui. But so far I couldn't find a way to do it. An example code is

import SwiftUI
import Charts

struct BarChartExampleView: View {
    let data = [ChartData(type: "fish", count: 10),
                ChartData(type: "reptils", count: 21),
                ChartData(type: "bird", count: 18),
                ChartData(type: "dog", count: 40),
                ChartData(type: "cat", count: 65)]
    
    var body: some View {
        Chart(data) { dataPoint in
            
            BarMark(x: .value("Population", dataPoint.count),
                    y: .value("Type", dataPoint.type))
            .foregroundStyle(by: .value("Type", dataPoint.type))
            .annotation(position: .trailing) {
                Text(String(dataPoint.count))
                    .foregroundColor(.gray)
            }
        }
        .chartLegend(.hidden)
        .chartXAxis(.hidden)
        .chartYAxis {
            AxisMarks { _ in
                AxisValueLabel()
            }
        }
        
        .aspectRatio(1, contentMode: .fit)
        .padding()
    }
}

#Preview {
    BarChartExampleView()
}

Which create a chart like this enter image description here

What I am trying to achieve is getting the type names like fist\h, cat, dog etc on the left side of the barview. Tried playing with chartYAxis and I didn't find a way to get it working. Any hints ?


Solution

  • Actually never mind, as soon as I posted here I found the solution. AxisMarks(preset: .extended, position: .leading