---
title: "chartYAxis(content:)"
framework: swiftui
role: symbol
role_heading: Instance Method
path: "swiftui/view/chartyaxis(content:)"
---

# chartYAxis(content:)

Configures the y-axis for charts in the view.

## Declaration

```swift
nonisolated func chartYAxis<Content>(@AxisContentBuilder content: () -> Content) -> some View where Content : AxisContent

```

## Parameters

- `content`: The axis content.

## Discussion

Discussion Use this modifier to customize the y-axis of a chart. Provide an AxisMarks builder that composes AxisGridLine, AxisTick, and AxisValueLabel structures to form the axis. Omit components from the builder to omit them from the resulting axis. For example, the following code adds grid lines to the y-axis: .chartYAxis {     AxisMarks {         AxisGridLine()     } } Use arguments such as position: or values: to control the placement of the axis values it displays. Chart(BatteryData.data, id: \.date) {      BarMark(          x: .value("Time", $0.date ..< $0.date.advanced(by: 1800)),          y: .value("Battery Level", $0.level)      )      .foregroundStyle(.green)  }  .chartYAxis {      AxisMarks(values: [0, 25, 50, 75, 100]) {          AxisGridLine()      }

AxisMarks(values: [0, 50, 100]) {          AxisValueLabel(format: Decimal.FormatStyle.Percent.percent.scale(1))      }  }  .chartXAxis {      AxisMarks(values: .stride(by: .hour, count: 3)) { value in          if let date = value.as(Date.self) {              let hour = Calendar.current.component(.hour, from: date)              switch hour {              case 0, 12:                  AxisValueLabel {                      VStack {                          Text(date, format: .dateTime.hour())                          if value.index == 0 {                              Text(date, format: .dateTime.month().day())                          }                      }                  }              default:                  AxisValueLabel(format: .dateTime.hour(.defaultDigits(amPM: .omitted)))              }

if hour == 0 {                  AxisGridLine(stroke: StrokeStyle(lineWidth: 0.5))                  AxisTick(stroke: StrokeStyle(lineWidth: 0.5))              } else {                  AxisGridLine()                  AxisTick()              }          }      }  }

The above code customizes the y-axis to appear on the leading edge of the chart, with a solid grid line at the 0% and 100% marks. note: To add an axis label, use one of the label modifiers, like chartYAxisLabel(position:alignment:spacing:content:).

## See Also

### Axes

- [chartXAxis(_:)](swiftui/view/chartxaxis(_:).md)
- [chartXAxis(content:)](swiftui/view/chartxaxis(content:).md)
- [chartXAxisStyle(content:)](swiftui/view/chartxaxisstyle(content:).md)
- [chartYAxis(_:)](swiftui/view/chartyaxis(_:).md)
- [chartYAxisStyle(content:)](swiftui/view/chartyaxisstyle(content:).md)
- [chartZAxis(_:)](swiftui/view/chartzaxis(_:).md)
- [chartZAxis(content:)](swiftui/view/chartzaxis(content:).md)
