オープンレイヤー3でマーカーを表示する方法

Question

オープンレイヤー3でマーカーにマーカーを表示しようとしています。以下は私が使用したコードです。特定の位置にアイコンが表示されないため、誰かが問題を見つけるのを助けることができますか？

var app = angular.module('Openlayers', []); 

//The list of points to be connected 
var dataSource1 = [{ 
    "title": 'Duero', 
    "lat": '40.480243', 
    "lng": '-3.866172', 
    "description": 'This is Duero' 
}, { 
    "title": 'Reyes Catolicos', 
    "lat": '49.47806', 
    "lng": '-1.870937', 
    "description": 'This is Reyes Catolicos' 
}, { 
    "title": 'Guadarrama', 
    "lat": '58.478998', 
    "lng": '-2.878755', 
    "description": 'This is Guadarrama' 
}]; 

var defaultIconPath = 'images/location.jpg'; 
var centerPosition = dataSource1[1]; 
var vehicleIconpath = 'images/vehicle.ico'; 

私は、メソッドを呼び出すための呼び出しの下に使用しています。データが間違った形式であるとき

$scope.populateMarkers($scope.dataPoints, defaultIconPath); 



$scope.populateMarkers = function (data, iconPath) { 
     var features = []; 

     angular.forEach(data, function (value, key) { 
      debugger; 

      var iconFeature = new ol.Feature({ 
       geometry: new ol.geom.Point(ol.proj.transform([value.lng, value.lat], 'EPSG:4326', 
       'EPSG:3857')) 
      }); 


      var iconStyle = new ol.style.Style({ 
       image: new ol.style.Icon(({ 
        anchor: [0.5, 46], 
        anchorXUnits: 'fraction', 
        anchorYUnits: 'pixels', 
        opacity: 0.75, 
        src: iconPath 
       })) 
      }); 

      iconFeature.setStyle(iconStyle); 
      features.push(iconFeature); 
     }); 
     var vectorSource = new ol.source.Vector({ 
      features: features 
     }); 

     var vectorLayer = new ol.layer.Vector({ 
      source: vectorSource 
     }); 

     map.addLayer(vectorLayer); 
    } 

Answer 1

OpenLayersをは好きではありません。
の座標は、数値がである必要がありますが、現在は文字列です。 ちょうど行います

var iconFeature = new ol.Feature({ 
    geometry: new ol.geom.Point(ol.proj.transform([parseFloat(value.lng), parseFloat(value.lat)], 'EPSG:4326', 'EPSG:3857')) 
}); 

が浮くためにそれらを解析するために、あなたは大丈夫です。