---
title: "init(x:y:width:height:)"
framework: charts
role: symbol
role_heading: Initializer
path: "charts/rectanglemark/init(x:y:width:height:)"
---

# init(x:y:width:height:)

Creates a rectangle that plots values with x and y.

## Declaration

```swift
nonisolated init<X, Y>(x: PlottableValue<X>, y: PlottableValue<Y>, width: MarkDimension = .automatic, height: MarkDimension = .automatic) where X : Plottable, Y : Plottable
```

## Parameters

- `x`: The value plotted with x.
- `y`: The value plotted with y.
- `width`: The rectangle width. If width is not specified, then 70% of the step size will be used. If there is no step size a default width (in pts) will be used.
- `height`: The rectangle height. If height is not specified, then 70% of the step size will be used. If there is no step size a default height (in pts) will be used.

## Discussion

Discussion Use this initializer to map an x and y position to a rectangle for each data element. Optionally, specify the width or height of the rectangles. The example below omits the optional width and height parameters and uses a number scale starting at (0,0). The rectangle has the coordinates: (0,0), (0,3), (3,0), (3,3). Chart(data) {     RectangleMark(         x: .value("Rect X", 3),         y: .value("Rect Y", 3)     )     .opacity(0.2)

PointMark(         x: .value("X", $0.x),         y: .value("Y", $0.y)     ) }

## See Also

### Creating a rectangle mark

- [init(x:yStart:yEnd:width:)](charts/rectanglemark/init(x:ystart:yend:width:)-vh2x.md)
- [init(x:yStart:yEnd:width:)](charts/rectanglemark/init(x:ystart:yend:width:)-xhqp.md)
- [init(xStart:xEnd:y:height:)](charts/rectanglemark/init(xstart:xend:y:height:)-27222.md)
- [init(xStart:xEnd:y:height:)](charts/rectanglemark/init(xstart:xend:y:height:)-4x46i.md)
- [init(xStart:xEnd:yStart:yEnd:)](charts/rectanglemark/init(xstart:xend:ystart:yend:)-1qbzg.md)
- [init(xStart:xEnd:yStart:yEnd:)](charts/rectanglemark/init(xstart:xend:ystart:yend:)-5682c.md)
- [init(xStart:xEnd:yStart:yEnd:)](charts/rectanglemark/init(xstart:xend:ystart:yend:)-5cbgh.md)
- [init(xStart:xEnd:yStart:yEnd:)](charts/rectanglemark/init(xstart:xend:ystart:yend:)-6jeka.md)
- [init(x:y:z:)](charts/rectanglemark/init(x:y:z:).md)