AngularJS: NgMap - On load map center isn't being respected

Question

In this AngularJS SPA using NgMap, I have map pins being set on data filtering. On initial load of the map, the map is centered on some place out in the ocean, not the coordinates I have set in the map object in the center parameter. I've also tried setting this on the map initialization without any success.

  $scope.$on('mapInitialized', function(event, map) {

    var myLatlng = new google.maps.LatLng(43.6650000, -79);
    var mapOptions = {
      draggable: true,
      zoom: 4,
      center: myLatlng
    }
    var map = new google.maps.Map(document.getElementById("map"), mapOptions);


  });

<map zoom="3" center="[43.6650000,-79]" scrollwheel="false" zoom-to-include-markers="true">
  <marker ng-repeat="site in filteredPins track by $index" position="[{{site.Latitude}},{{site.Longitude}}]" id="{{site.Id}}" title="{{site.SiteName}}"></marker>
</map>

Where/how does one set the initial map location on load if not through the <map> center param, or the center option in the map options when the map is initialized?

Plunkr: http://plnkr.co/edit/u75fJT?p=preview

Answer 1

Your code is correct, the initial map center is exactly at the coordinates you've specified, the problem seems to be on the html zoom-to-include-markers="true" that is changing the map center after loaded

<map zoom="3" center="[43.6650000,-79]" scrollwheel="false" zoom-to-include-markers="true">

remove zoom-to-include-markers="true" and it will work