Adding markers with style does not work
Closed this issue · 2 comments
JcDenton86 commented
Hello,
Trying to add markers which are fetched from API like this:
HTML
<div ng-controller="mapController as map">
<openlayers width="100%" height="100%" lat="map.center.lat" lon="map.center.lon" zoom="16">
<ol-marker ng-repeat="marker in map.markers" lat="marker.lat" lon="marker.lon" name="marker.descr"></ol-marker></openlayers>
</div>
JavaScript
mapService.fetchFromREST().then(function(markers){
var icon;
angular.forEach(markers, function(value, key) {
icon = new ol.style.Style({
image: new ol.style.Circle({
radius: 5,
stroke: new ol.style.Stroke({
color: '#000'
}),
fill: new ol.style.Fill({
color: value.color
})
})
});
markers[key].style = icon;
});
map.markers= markers;
console.log(map.ramps);
});
console.log(map.markers)
is fine but the markers are not showing up on the map.
Can anyone help?
oubaguilai commented
hello,can you tell me have you resolve this problem,and how
JcDenton86 commented
Hi, yes I found how to make it work properly. Below is the body of the function that creates the styles of each marker and appends it to the response array.
this.fetchFromREST = function(){
return $q(function(resolve, reject) {
$http.get("http://serverApiUrl/",{},{},function(response){
var resp = JSON.parse(response.data);
angular.forEach(resp, function(value, key) {
resp[key].style = new ol.style.Style({
image: new ol.style.Circle({
radius: 5,
stroke: new ol.style.Stroke({
color: '#000'
}),
fill: new ol.style.Fill({
color: value.color
})
})
});
});
resolve(resp);
},function(error){console.log(error);reject(error);});
});
};