Video is not plying on GMSMarker

Question

I am working on play video on GMSMarker pin and below is my code. The display and hide/show pin view, everything work fine. Except video not play. I am using story board with pinview.

@interface MapViewController () <GMSMapViewDelegate>

@property (strong, nonatomic) IBOutlet GMSMapView *mapView;
@property (strong, nonatomic) IBOutlet UIView *pinView;
@property (strong, nonatomic) GMSMarker *london;
@property (strong, nonatomic) AVPlayer *player;
@property (strong, nonatomic) AVPlayerLayer *playerLayer;

@end

@implementation MapViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:51.5 longitude:-0.127 zoom:18];
    self.mapView.camera = camera;
    self.mapView.delegate = self;

    CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
    _london = [GMSMarker markerWithPosition:position];
    _london.title = @"London";
    _london.tracksViewChanges = YES;
    _london.map = self.mapView;

    [self setUpVideoPlayer];
}

- (UIView *)mapView:(GMSMapView *)mapView markerInfoWindow:(GMSMarker *)marker {
    [self.player play];
    return self.pinView;
}

-(void)setUpVideoPlayer{

     NSString *videoFilePath = [[NSBundle mainBundle] pathForResource:@"SampleVideo" ofType:@"mp4"];
     AVAsset *avAsset = [AVAsset assetWithURL:[NSURL fileURLWithPath:videoFilePath]];
     AVPlayerItem *avPlayerItem =[[AVPlayerItem alloc]initWithAsset:avAsset];
     self.player = [[AVPlayer alloc]initWithPlayerItem:avPlayerItem];
     self.playerLayer =[AVPlayerLayer playerLayerWithPlayer:self.player];
     [self.playerLayer setFrame:self.pinView.frame];
     [self.pinView.layer addSublayer:self.playerLayer];
     [self.player seekToTime:kCMTimeZero];
}

Please help me to fix the issue. Why the video is not playing.

Thanks in advance.

Answer 1

I believe that the reason why your code doesn't work is the fact that Google Maps for iOS renders Custom Info Views as Images. I'm not sure, but I believe, since I have also tried with animations and it also doesn't work. When I use animation, I first see the initial state of animation and when I open marker info window again, I see the final state, without animation. Also, when I add a text field on custom info window view, I can't click on that text field. When I try with the video like you, I see a blank window like the player is going to start and hear the sound, but the video never starts.

I have found this note on many questions on Stackoverflow (they say that it is from Google Docs), but I don't see it on Google Docs:

Note: The info window is rendered as an image each time it is displayed on the map. This means that any changes to its properties, while it is active, will not be immediately visible. The contents of the info window will be refreshed the next time that it is displayed.

Source: Google Maps Showing speech bubble in marker info window iOS

Maybe you can try with tracksInfoWindowChanges = YES:

- (UIView *)mapView:(GMSMapView *)mapView markerInfoWindow:(GMSMarker *)marker {
     marker.tracksInfoWindowChanges = YES;
     self.player play];
     return self.pinView;
}

Source: How to force refresh contents of the markerInfoWindow in Google Maps iOS SDK

I know that you have set it in viewDidLoad method, but maybe setting it in a
- (UIView *)mapView:(GMSMapView *)mapView markerInfoWindow:(GMSMarker *)marker method maybe will work, but I don't believe. A lot of people say that setting markerInfoWindow to YES works, but I have tried, and it doesn't work.

I have tried to use iOS Maps and video plays without problems. I have never had a problem with using Apple Maps. So, I'm sure that Google Maps isn't a good solution for this problem. Maybe you could fix it by some hack, but I have lost several hours to find a solution, without results. Maybe it can be done, for example, to move a UIView above map when the user moves his finger on the map or zooms in/out, or some other solution, but I prefer system solutions above hacks. In this case, I don't see system solution, maybe I'd find it if I spent more time to research. If I were you, I wouldn't use Google Maps for this.

Edit: I've just seen that my solution works on simulator. On real device (iPhone 7+) it doesn't work, i.e. I see player controls are animating, I see sound, but I don't see the video. But even if it works on real device like it works on simulator, user can't play or pause video, because he only sees images which are updating regularly.

Answer 2

Normally, info window will not regenerate after showing it(its adding as an image). To show video frames it need to regenerate when video play. It means window need to refresh automatically. To do it you need to set one property for your GMSMarker. Line as follows,

    _london.tracksInfoWindowChanges = YES;

So your full code is

CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
_london = [GMSMarker markerWithPosition:position];
_london.title = @"London";
_london.tracksViewChanges = YES;
_london.tracksInfoWindowChanges = YES;
_london.map = self.mapView;

Google documentation is https://developers.google.com/maps/documentation/ios-sdk/marker#set_an_info_window_to_refresh_automatically