Chart content that represents data using points.
You can create different kinds of point charts using the `PointMark` chart content. One common chart you can build with point marks is a scatter plot which displays the relationship between two numerical data properties. To build a
scatter plot use the ``init(x:y:)``. Provide a `.value` for both the `x` and `y` parameters with a string, used as a label for the
data, and the data element to be plotted. The following example plots the `wingLength` and `wingHeight` properties with x and y,
respectively:
```swift
struct Insect {
let name: String
let family: String
let wingLength: Double
let wingWidth: Double
let weight: Double
}
var data: [Insect] = [
Insect(name: "Hepialidae", family: "Lepidoptera", wingLength: 61, wingWidth: 52, weight: 22),
Insect(name: "Danaidae", family: "Lepidoptera", wingLength: 60, wingWidth: 48, weight: 24),
Insect(name: "Riodinidae", family: "Lepidoptera", wingLength: 53, wingWidth: 43, weight: 18),
// ...
]
var body: some View {
Chart(data) {
PointMark(
x: .value("Wing Length", $0.wingLength),
y: .value("Wing Width", $0.wingWidth)
)
}
}
```
### Adding Additional Data Fields
Swift Charts provides three additional modifiers for point mark that each allow you to plot an additional property to a unique visual channel.
Modifier | Visual Channel
--- | ---
``ChartContent/foregroundStyle(by:)`` | plot an additional property with color
``ChartContent/symbol(by:)`` | plot an additional property with symbols
``ChartContent/symbolSize(by:)`` | plot an additional property with size
For example, to plot the `family` property from the previous example's `Insect` structure as a color, add the ``ChartContent/foregroundStyle(by:)`` modifier:
```swift
Chart(data) {
PointMark(
x: .value("Wing Length", $0.wingLength),
y: .value("Wing Width", $0.wingWidth)
)
.foregroundStyle(by: .value("Family", $0.family))
}
```
The foreground style modifier automatically generates a color scale that provides each mark with a color that reflects its value property. To learn how to modify the
default color scale, see ``ScaleModifiers``. The modifier also provides a default legend. To learn how to modify or disable the legend, see ``ChartLegend``.
Alternatively, you can distinguish families with different symbols by plotting the `family` property using the ``ChartContent/symbol(by:)`` modifier:
```swift
Chart(data) {
PointMark(
x: .value("Wing Length", $0.wingLength),
y: .value("Wing Width", $0.wingWidth)
)
.symbol(by: .value("Family", $0.family))
}
```
### PointMark in Chart3D
To make a point in a 3D Chart, use the ``PointMark/init(x:y:z:)`` initializer.
In addition to an `x` and `y` value, you can now position your `PointMark` along the `z` axis.
For example, in addition to plotting an insect's `wingLength` and `wingWidth` you can also plot their `weight` with the following `Chart3D`:
```swift
Chart3D(data) {
PointMark(
x: .value("Wing Length", $0.wingLength),
y: .value("Wing Width", $0.wingWidth),
z: .value("Weight", $0.weight)
)
.foregroundStyle(by: .value("Category", $0.family))
}
```
## Styling a 3D PointMark
3D points also offer symbols, such as ``Chart3DSymbolShape/sphere``, ``Chart3DSymbolShape/cylinder``, ``Chart3DSymbolShape/cone``,
and ``Chart3DSymbolShape/cube``. Combined with the ``Chart3DContent/symbolSize(_:)-(CGFloat)``
and ``Chart3DContent/symbolRotation(_:)-(Rotation3D)`` modifiers, you can provide rich customizations for your 3D points:
```swift
Chart3D(PointMarkData.insectData) {
PointMark(
x: .value("Wing Length", $0.wingLength),
y: .value("Wing Width", $0.wingWidth),
z: .value("Weight", $0.weight)
)
.symbol(.cone)
.symbolSize(0.05)
.foregroundStyle(by: .value("Category", $0.family))
}
```
nonisolated init<Y>(x: CGFloat? = nil, y: PlottableValue<Y>) where Y : Plottable
Creates a point mark with fixed x position and plots values with y.
- Parameters:
- x: The x position. If `x` is `nil`, the bar will be centered horizontally by default.
- y: The value plotted with y.
### Discussion
Use this initializer to plot a property to y:
```swift
Chart(data) {
PointMark(
y: .value("Weight", $0.weight)
)
}
```
For more background, see the first example used in ``PointMark`` which shows the structure that contains the `weight` property.
nonisolated init<X>(x: PlottableValue<X>, y: CGFloat? = nil) where X : Plottable
Creates a point mark that plots a value on x with fixed y position.
- Parameters:
- x: The value plotted with x.
- y: The y position. If `y` is `nil`, the bar will be centered vertically by default.
### Discussion
Use this initializer to plot a property with x:
```swift
Chart(data) {
PointMark(
x: .value("Weight", $0.weight)
)
}
```
For more background, see the first example used in ``PointMark`` which shows the structure that contains the `weight` property.
nonisolated init<X, Y>(x: PlottableValue<X>, y: PlottableValue<Y>) where X : Plottable, Y : Plottable
Creates a point mark that plots values to x and y.
- Parameters:
- x: The value plotted with x.
- y: The value plotted with y.
### Discussion
Use this initializer to plot one property with x and another property with y:
```swift
Chart(data) {
PointMark(
x: .value("Wing Length", $0.wingLength),
y: .value("Wing Length", $0.wingWidth)
)
}
```
For more background, see the first example used in ``PointMark`` which shows the structure that contains the `wingLength` and
`wingHeight` properties.
Skipped declarations
1 declarations were excluded from these bindings. Each reason comes from the generator or the iOS SDK compiler.
PointMark.init(x:y:z:)
This protocol needs associated types that cannot yet cross the bridge.
