dylanfprice / angular-gm

AngularJS Google Maps Directives
MIT License
198 stars 47 forks source link

Cannot center the map, initially #72

Closed thany closed 9 years ago

thany commented 9 years ago

When the map loads, it always goes to (46,-120) which is just about in the middle of nowhere. But more importantly, it doesn't go where I set it to go.

Here's how I'm calling the map:

<gm-map gm-map-id="'myMap'" gm-center="map.center" gm-zoom="map.zoom" style="width:500px;height:500px;"></gm-map>

Initializing my scope:

mapsControllers.controller("MainController", [ "$scope", function($scope) {
  $scope.map = {
    center: new google.maps.LatLng(35.5, -220),
    zoom: 8
  };
}]);

A split second after being done loading, the map helps itself to this other location that is nowhere in my code. Only when I set $scope.map.center to this exactly the same value later on, for example in the click-hander of a button, it works as expected (the map moves to that location). It seems that the map doesn't want to initialize itself with a location other than (46,-120).

On a side note, and possibly related: I find it very strange that the center variable must be a google.maps.LatLng object. That's not the "angular" way - it makes it unneccesarily difficult to bind its values to other elements.

brocksamson commented 9 years ago

see my comment on #58 for details on how to center the map.

dylanfprice commented 9 years ago

From the docs:

The gm-center, gm-zoom, gm-bounds, and gm-map-type-id variables do not have to exist in the current scope--they will be created if necessary. All three have bi-directional association, i.e. drag or zoom the map and they will update, update them and the map will change. However, any initial state of these three variables will be ignored.

Those attributes are for bi-directional association of the center of the map with a scope variable. What you want is:

<gm-map gm-map-id="'myMap'" gm-map-options="map" style="width:500px;height:500px;"></gm-map>

As for the center being a google.maps.LatLng object, I somewhat agree but I think I decided that inserting a layer that converts back and forth every time the center changes was not worth the complexity--really what's wrong with a google.maps.LatLng? If you could explain more what you mean by "makes it unneccesarily difficult to bind its values to other elements" maybe I can help you out.