<!--
{
  "availability" : [
    "iOS: 26.0.0 -",
    "iPadOS: 26.0.0 -",
    "macCatalyst: 26.0.0 -",
    "macOS: 26.0.0 -",
    "visionOS: 26.0.0 -"
  ],
  "documentType" : "symbol",
  "framework" : "Charts",
  "identifier" : "/documentation/Charts/SurfacePlot",
  "metadataVersion" : "0.1.0",
  "role" : "Structure",
  "symbol" : {
    "kind" : "Structure",
    "modules" : [
      "Swift Charts"
    ],
    "preciseIdentifier" : "s:6Charts11SurfacePlotV"
  },
  "title" : "SurfacePlot"
}
-->

# SurfacePlot

Chart content that represents a mathematical function of two variables using a 3D surface.

```
@MainActor @preconcurrency struct SurfacePlot
```

## Overview

Use `SurfacePlot` to visualize a 3D surface for functions of the form `y = f(x, z)`

## Overview

To create a `SurfacePlot`, provide a closure that takes `x` and `z` values as input and returns a `y` value. For example, to draw the function `y = sin(2 * x) * cos(2 * z)`, you write:

```swift
Chart3D {
    SurfacePlot(x: "x", y: "y", z: "z") { x, z in
        sin(2 * x) * cos(2 * z)
    }
    .foregroundStyle(.heightBased)
}
.chartXScale(domain: -2...2)
.chartYScale(domain: -1...1)
.chartZScale(domain: -2...2)
```

You can also explicitly define the plotting space of your `Chart3D` using the `Chart/chartXScale(domain:range:type:)->View`, `Chart/chartYScale(domain:range:type:)->View`, and `Chart/chartYScale(domain:range:type:)->View` modifiers.

## Styling the Surface

You can style the surface using standard Swift Charts modifiers like `foregroundStyle(_:)-(Chart3DSurfaceStyle)->Chart3DContent`. You may find this useful for Charts that contain more than one `SurfacePlot`.
A common and effective style for surfaces is [`heightBased`](/documentation/Charts/Chart3DSurfaceStyle/heightBased), which creates a gradient using colors based on the y-value of your surface, making it easier to perceive its shape.
You can also use [`normalBased`](/documentation/Charts/Chart3DSurfaceStyle/normalBased) to color points on the `SurfacePlot` based on the direction that it is facing.

```swift
Chart3D {
    SurfacePlot(x: "x", y: "y", z: "z") { x, z in
        sin(2 * x) * cos(2 * z) * 0.5
    }
    .foregroundStyle(.heightBased)

    SurfacePlot(x: "x", y: "y", z: "z") { x, z in
        sin(4 * x) * cos(4 * z) * 0.2 - 1
    }
    .foregroundStyle(.normalBased)
}
.chartXScale(domain: -2...2)
.chartYScale(domain: -1.5...1)
.chartZScale(domain: -2...2)
```

Chart content that represents a collection of data using three-dimensional data.

## Relationships

### Conforms To

[`Chart3DContent`](/documentation/Charts/Chart3DContent)

[`SendableMetatype`](/documentation/Swift/SendableMetatype)

[`Sendable`](/documentation/Swift/Sendable)

---

Copyright &copy; 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)