我使用Openlayers-directive并尝试使用标记创建图层。我查看了示例this和this
我的观点(SLIM):
openlayers ol-center="center" ol-defaults="defaults" custom-layers="true"
ol-layer ol-layer-properties="layers.main"
ol-layer ol-layer-properties="layers.markers"
我的控制器:
MapCtrl = ($scope, olData, Node) ->
ctrl = this
$scope.markers = []
ctrl.source = new ol.source.Vector(features: $scope.markers)
ctrl.clusterSource = new ol.source.Cluster({
distance: 40
source: ctrl.source
})
getStyle = (feature) ->
style = createPointStyle('blue')
createPointStyle = (color, text) ->
options = image: new (ol.style.Circle)(
radius: 10
fill: new (ol.style.Fill)(
color: color
opacity: 0.6)
stroke: new (ol.style.Stroke)(
color: 'white'
opacity: 0.4))
return
angular.extend $scope, {
events:
map: ['moveend']
layers:
main:
source:
type: "OSM"
markers:
clustering: true
clusteringDistance: 40
style: getStyle
}
$scope.query_marker = ->
# console.debug gon.location
Node.get {}, (res) ->
ctrl.source.clear()
ctrl.source.addFeature new ol.Feature(new ol.geom.Point(51.5406, 46.0086))
ctrl.clusterSource.set 'source', ctrl.source
$scope.layers.source = ctrl.clusterSource
return
$scope.$on 'openlayers.map.moveend', (event, data) ->
$scope.$apply ->
$scope.query_marker()
return
return
但标记未显示,并出现在控制台错误中:
angular.self-5657ace….js?body=1:12478 TypeError: Cannot read property 'all' of undefined
at dm (ol.self-72a25ce….js?body=1:293)
at bm.l.forEach (ol.self-72a25ce….js?body=1:293)
at forEach (angular.self-5657ace….js?body=1:341)
at copy (angular.self-5657ace….js?body=1:933)
at copy (angular.self-5657ace….js?body=1:902)
at copy (angular.self-5657ace….js?body=1:946)
at copy (angular.self-5657ace….js?body=1:902)
at copy (angular.self-5657ace….js?body=1:946)
at copy (angular.self-5657ace….js?body=1:902)
at copy (angular.self-5657ace….js?body=1:946)(anonymous function) @ angular.self-5657ace….js?body=1:12478(anonymous function) @ angular.self-5657ace….js?body=1:9247$digest @ angular.self-5657ace….js?body=1:15845$apply @ angular.self-5657ace….js?body=1:16098done @ angular.self-5657ace….js?body=1:10547completeRequest @ angular.self-5657ace….js?body=1:10745requestLoaded @ angular.self-5657ace….js?body=1:10686
angular.self-5657ace….js?body=1:12478 Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []
http://errors.angularjs.org/1.4.7/$rootScope/infdig?p0=10&p1=%5B%5D
at angular.self-5657ace….js?body=1:69
at Scope.$digest (angular.self-5657ace….js?body=1:15865)
at Scope.$apply (angular.self-5657ace….js?body=1:16098)
at done (angular.self-5657ace….js?body=1:10547)
at completeRequest (angular.self-5657ace….js?body=1:10745)
at XMLHttpRequest.requestLoaded (angular.self-5657ace….js?body=1:10686)(anonymous function) @ angular.self-5657ace….js?body=1:12478(anonymous function) @ angular.self-5657ace….js?body=1:9247$apply @ angular.self-5657ace….js?body=1:16100done @ angular.self-5657ace….js?body=1:10547completeRequest @ angular.self-5657ace….js?body=1:10745requestLoaded @ angular.self-5657ace….js?body=1:10686
angular.self-5657ace….js?body=1:69 Uncaught Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []
http://errors.angularjs.org/1.4.7/$rootScope/infdig?p0=10&p1=%5B%5D