How to re-render Ember components with google maps

First the code:

I have created an Ember component which renders Google Maps v3 map like:

App.GoogleMapsComponent = Ember.Component.extend(
classNames: ['ember-view-map']

insertMap: (->
  @getUserLatLng()
  options =
    center: new google.maps.LatLng(
      @get('latitude'),
      @get('longitude')
    )
    zoom: 14
    draggable: false
    zoomControl: false
    panControl: false
    streetViewControl: false
    scaleControl: false
    mapTypeControl: false
    scrollwheel: false
    disableDoubleClickZoom: true
    mapTypeId: google.maps.MapTypeId.ROADMAP

  @set 'map', new google.maps.Map(@$('.map-container')[0], options)
  @set 'markerCache', []
  @coordinatesChanged()
  @setMarkers()
).on('didInsertElement')

getUserLatLng: ->
  self = @
  if !@.get('latitude') || !@.get('longitude')
    $.ajax
      url: '//ipinfo.io/json',
      success: (response) ->
        self.set('latitude', response.loc.split(',')[0])
        self.set('longitude', response.loc.split(',')[1])
      ,
      dataType: 'json'

coordinatesChanged: (->
  map = @get('map')
  if map
    map.setCenter new google.maps.LatLng(@get('latitude'), @get('longitude'))
    map.setZoom map.getZoom()
    google.maps.event.trigger(map, 'resize')
  return
).observes('latitude', 'longitude')

Component template is:

.map-wrapper
  .map-container

And I use it in other outlet like:

.row.row-map
 .col-md-12.col-map
   google-maps latitude=location.latitude longitude=location.longitude markers=markers

Issue and scenarios

1. First scenario

This outlet is routed to my '/' and now if I render this page by entering URL from browser it renders this component just fine.

2. Second scenario

I visit other page in app and use link-to link to transition to my '/', google-maps component renders fine.

3. Third scenario (with issues)

I visit '/', transition to other page using link-to let's say page about and from there I get back to '/' also using link-to link. Then the component is not rendered properly.

I can see proper DOM elements but google map is not resized to full width/height it shows just one layer of map in left-top corner like:

So the issue occurs when I try to re-render the component because when it renders first time it looks fine. I thought that the component is destroyed completely when transitioning to other route and it looks like it when I tried to log this object in console it is undefined after transitioning to route other than '/'.