# Add an inset map

> **Note (legacy): A newer version of the Maps SDK is available**
> 
> This page uses v6.4.1 of the Mapbox Maps SDK. A newer version of the SDK is available. Learn about the latest version, v11.31.0, in the [Maps SDK documentation](https://docs.mapbox.com/ios/maps/guides/).

![](https://docs.mapbox.com/ios/assets/ideal-img/maps-examples-inset-map.6c3c7e0.480.png)

This example adds a secondary map view to your map for a picture in picture experience.

**Swift**

Title: `ViewController`

[View on GitHub](https://github.com/mapbox/ios-sdk-examples/tree/298e050be7352eb28cee6f03e02945593140c1f3/Examples/Swift/InsetMapExample.swift)

```swift
import Mapbox

class ViewController: UIViewController, MGLMapViewDelegate {
    var mapView: MGLMapView!
    var miniMapview: MGLMapView!
    
    override func viewDidLoad() {
        super.viewDidLoad()

        mapView = MGLMapView(frame: view.bounds)
        mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]

        /** Set the delegate property of our map view to self after
        instantiating it.
        */
        mapView.delegate = self
        
        // Set the main map view's center coordinate and zoom level.
        mapView.setCenter(CLLocationCoordinate2D(latitude: 18.1096,
                longitude: -77.2975), zoomLevel: 9, animated: false)
        
        // Set inset map View's center
        miniMapview = MGLMapView(frame: CGRect.zero)
        
        /**
         Set inset mapview properties to create a smaller,
         non-interactive map view that mimics the appearance of the main map view.
        */
        miniMapview.allowsScrolling = false
        miniMapview.allowsTilting = false
        miniMapview.allowsZooming = false
        miniMapview.allowsRotating = false
        miniMapview.compassView.isHidden = true

        /**
         Hiding the map view's attribution goes against our attribution requirements.
         However, because the main map view still has attribution, hiding the
         attribution for the mini map view in this case is acceptable.

         For more information, please refer to our attribution guidelines:
         https://docs.mapbox.com/help/how-mapbox-works/attribution/
        */
        miniMapview.logoView.isHidden = true
        miniMapview.attributionButton.tintColor = UIColor.clear
        miniMapview.layer.borderColor = UIColor.black.cgColor
        miniMapview.layer.borderWidth = 1
        
        /**
         Set the mini map view zoom level differently from the main map view to
         either display a broader geographical view, or display more detail
         within a particular area.
        */
        miniMapview.setCenter(self.mapView.centerCoordinate,
                              zoomLevel: mapView.zoomLevel - 2, animated: false)
        miniMapview.translatesAutoresizingMaskIntoConstraints = false
        
        view.addSubview(mapView)
        view.addSubview(miniMapview)
        
        installConstraints()
    }
    
    /**
     Set the mini map view's camera to the map view camera so while
     the region is changing on the map view, the same camera changes
     are made in the mini map view.
     */
    func mapViewRegionIsChanging(_ mapView: MGLMapView) {
         miniMapview.setCenter(self.mapView.centerCoordinate,
         zoomLevel: mapView.zoomLevel - 2, animated: false)
     }

    
    func installConstraints() {
        if #available(iOS 11.0, *) {
            let safeArea = self.view.safeAreaLayoutGuide
            NSLayoutConstraint.activate([
                miniMapview.bottomAnchor.constraint(equalTo:
                    safeArea.bottomAnchor, constant: -40),
                miniMapview.trailingAnchor.constraint(equalTo:
                    safeArea.trailingAnchor, constant: -15),
                miniMapview.widthAnchor.constraint(equalTo:
                    safeArea.widthAnchor, multiplier: 0.33),
                miniMapview.heightAnchor.constraint(equalTo:
                    miniMapview.widthAnchor)
            ])
        } else {
            miniMapview.autoresizingMask = [.flexibleTopMargin,
                                            .flexibleLeftMargin,
                                            .flexibleRightMargin]
        }
    }
}
```

**Objective C**

Title: `ViewController`

[View on GitHub](https://github.com/mapbox/ios-sdk-examples/tree/298e050be7352eb28cee6f03e02945593140c1f3/Examples/ObjectiveC/InsetMapExample.m)

```swift
#import "ViewController.h"
@import Mapbox;
@interface ViewController () <MGLMapViewDelegate>
@property (nonatomic) MGLMapView *mapView;
@property (nonatomic) MGLMapView *miniMapView;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    self.mapView = [[MGLMapView alloc] initWithFrame:self.view.bounds];
    self.mapView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;

    // Set the delegate property of our map view to self after instantiating it.
    self.mapView.delegate = self;
    
    // Set the main map view's center coordinate and zoom level.
    [self.mapView setCenterCoordinate:CLLocationCoordinate2DMake(
        18.1096,-77.2975) zoomLevel:9 animated:NO];

    /**
     Set inset map view properties to create a smaller,
     non-interactive map view that mimics the appearance of the main map view.
     */
    self.miniMapView = [[MGLMapView alloc] initWithFrame:CGRectZero];
    self.miniMapView.allowsScrolling = NO;
    self.miniMapView.allowsTilting = NO;
    self.miniMapView.allowsZooming = NO;
    self.miniMapView.rotateEnabled = NO;
    
    /**
     Hiding the map view's attribution goes against our attribution requirements.
     However, because the main map view still has attribution, hiding the
     attribution for the mini map view in this case is acceptable.

     For more information, please refer to our attribution guidelines:
     https://docs.mapbox.com/help/how-mapbox-works/attribution/
    */
    self.miniMapView.logoView.hidden = YES;
    self.miniMapView.compassView.hidden = YES;
    self.miniMapView.attributionButton.tintColor = UIColor.clearColor;
    self.miniMapView.layer.borderColor = UIColor.blackColor.CGColor;
    self.miniMapView.layer.borderWidth = 1;
    
    /**
     Set the mini map view zoom level differently from the main map view to
     either display a broader geographical view, or display more detail
     within a particular area.
    */
    [self.miniMapView setCenterCoordinate:self.mapView.centerCoordinate zoomLevel:self.mapView.zoomLevel - 2 animated:NO];
    [self.miniMapView setTranslatesAutoresizingMaskIntoConstraints:NO];

    [self.view addSubview:self.mapView];
    [self.view addSubview:self.miniMapView];
    [self installConstraints];
}

/**
 Set the mini map view's camera to the map view camera so while the region is changing on the
 map view, the same camera changes are made in the mini map view.
*/
- (void)mapViewRegionIsChanging:(MGLMapView *)mapView{
   [self.miniMapView setCenterCoordinate:self.mapView.centerCoordinate zoomLevel:self.mapView.zoomLevel - 2 animated:NO];
}

- (void)installConstraints {
    if (@available(iOS 11, *)) {
        UILayoutGuide *safeArea = self.view.safeAreaLayoutGuide;
        NSArray *constraints = @[
        [self.miniMapView.bottomAnchor constraintEqualToAnchor:
         safeArea.bottomAnchor constant:-40],
        [self.miniMapView.trailingAnchor constraintEqualToAnchor:
         safeArea.trailingAnchor constant:-15],
        [self.miniMapView.widthAnchor constraintEqualToAnchor:
         safeArea.widthAnchor multiplier:0.33],
        [self.miniMapView.heightAnchor constraintEqualToAnchor:
         self.miniMapView.widthAnchor]
        ];
    
        [NSLayoutConstraint activateConstraints:constraints];
    } else {
        self.miniMapView.autoresizingMask = UIViewAutoresizingFlexibleTopMargin
        | UIViewAutoresizingFlexibleLeftMargin |
        UIViewAutoresizingFlexibleRightMargin;
    }
}

@end
```