# Padding The values that define content padding within the map view frame. ``` class Padding implements PaddingData ``` ## Overview Use padding to define edge insets on the map. MapKit JS then uses these insets when it positions items on the map, such as the map controls or annotations. For example, if you want to add your own control on top of the map and ensure that the map doesn’t position annotations underneath it, you can add padding to the map and then position your control within the padded area. You can use a [`Padding`](/documentation/MapKitJS/Padding) object when setting the map’s [`padding`](/documentation/MapKitJS/Map/padding) property or as an option of [`showItems(items, options)`](/documentation/MapKitJS/Map/showItems). Positive values add padding to the inside edges of the map. MapKit JS clips negative values to `0`. ## Topics ### Creating padding [`constructor();`](/documentation/MapKitJS/Padding/PaddingConstructor) Creates a padding object with no inset margins. [`constructor(paddings: PaddingData);`](/documentation/MapKitJS/Padding/PaddingConstructor1) Creates a padding object and initializes its values with the provided object literal. [`constructor(top: number);`](/documentation/MapKitJS/Padding/PaddingConstructor2) Creates a padding object and initializes its top inset margin with the provided value. [`constructor(top: number, right: number);`](/documentation/MapKitJS/Padding/PaddingConstructor3) Creates a padding object and initializes it with the provided top and right side values. [`constructor(top: number, right: number, bottom: number);`](/documentation/MapKitJS/Padding/PaddingConstructor4) Creates a padding object and initializes it with the provided top, right, and bottom values. [`constructor(top: number, right: number, bottom: number, left: number);`](/documentation/MapKitJS/Padding/PaddingConstructor5) Creates a padding object and initializes it with the provided values. ### Controlling the map’s padding [`bottom: number;`](/documentation/MapKitJS/Padding/bottom) The amount of padding, in CSS pixels, to inset the map from the bottom edge. [`left: number;`](/documentation/MapKitJS/Padding/left) The amount of padding, in CSS pixels, to inset the map from the left edge. [`right: number;`](/documentation/MapKitJS/Padding/right) The amount of padding, in CSS pixels, to inset the map from the right edge. [`top: number;`](/documentation/MapKitJS/Padding/top) The amount of padding, in CSS pixels, to inset the map from the top edge. ### Variables [`static readonly Zero: Padding;`](/documentation/MapKitJS/Padding/Zero) An object that represents zero padding values. ### Instance Methods [`copy(): Padding;`](/documentation/MapKitJS/Padding/copy) Returns a copy of the padding object. [`equals(anotherPadding: Padding): boolean;`](/documentation/MapKitJS/Padding/equals) Compares whether two padding values are equal. [`toString(): string;`](/documentation/MapKitJS/Padding/toString) Returns a string representation of the padding object. ## Relationships ### Conforms To [`PaddingData`](/documentation/MapKitJS/PaddingData) --- Copyright © 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)