View padding

This sample shows how to use the padding property on the MapView. Use this to make center, extent, etc. work off a subsection of the full view. After setting the padding, you can place the UI elements in the padding area and still make the map center properly in the view.

In this sample a sidebar 320px wide is placed on top of the right side of the view. We can offset the center of the view by this same width so that zooming and UI elements are properly placed in the remaining view space.

Use dark colors for code blocksCopy
1
2
// Same value as the #sidebar width in CSS
view.padding.right = 320;

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.