angular-google-maps:找不到有效的中心资产?

avi*_*ian 4 google-maps-api-3 angularjs angularjs-directive

我正试图让angular-google-maps工作.我已根据说明设置了所有内容,但我似乎无法解决此错误:

angular-google-maps:找不到有效的中心属性

我的页面控制器中有这个:

angular.extend($scope, {
   center: {
    latitude: 0, // initial map center latitude
    longitude: 0, // initial map center longitude
   },
   markers: [], // an array of markers,
   zoom: 8, // the zoom level
});
Run Code Online (Sandbox Code Playgroud)

这在我的HTML中

<google-map center="center" zoom="zoom" markers="markers" refresh="!isMapElementHidden" style="height: 400px"></google-map>
Run Code Online (Sandbox Code Playgroud)

几点: - 似乎在我的控制器代码之前调用了angular-google-maps指令代码,因此还没有创建$ scope.center变量

  • 当我在中心硬编码工作时

  • 我试试这个,但没有任何运气,因为地图永远不会更新到控制器中设置的新应对值:

    center ="center?center:{latitude:36.990282103105066,经度:-122.06149578094482}"

  • 我也试图实现Angular Leaflet贴图并得到完全相同的问题

谢谢!

Vin*_*uis 5

工作演示

你没有通过中心属性而且我建议你使用r1-dev分支指令而不是angular-google-maps的master分支指令,传递像这样的参数

 angular.extend($scope, {
        centerProperty: {
            lat: 45,
            lng: -73
        },
        zoomProperty: 8,
        markersProperty: [ {
                latitude: 45,
                longitude: -74
            }],
        clickedLatitudeProperty: null,  
        clickedLongitudeProperty: null,
    });
Run Code Online (Sandbox Code Playgroud)

或者你也可以使用

position: {
  coords: {
    latitude: 36.990282103105066,
    longitude: -122.06149578094482
  }
},
Run Code Online (Sandbox Code Playgroud)