I'm using Angular and OpenLayer to build an web-app.
I have a map which is working and I have added a Vector (icon) which is also working. I have made a circle with the same center as the icon which also works.
Now when the user clicks on a button I want that icon and circle to move to a new location which works for the icon but the not circle using:
$scope.iconFeature.getGeometry().setCoordinates(ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857'));$scope.circleFeature.getGeometry().setCoordinates(ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857'));The iconFeature is implemented using:
var iconFeatures=[];$scope.iconGeometry = new ol.geom.Point(ol.proj.transform([long, lat], "EPSG:4326", "EPSG:3857"));$scope.iconFeature = new ol.Feature({ geometry: $scope.iconGeometry,});iconFeatures.push($scope.iconFeature);var vectorSource = new ol.source.Vector({ features: iconFeatures});var iconStyle = new ol.style.Style({ image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({ anchor: [16, 32], anchorXUnits: 'pixels', anchorYUnits: 'pixels', opacity: 1, src: 'img/positions_marker.png' }))});The circleFeature is implemented using:
$scope.circleFeature = new ol.Feature( new ol.geom.Polygon.circular( new ol.Sphere(6378137), [long, lat], 600, 64 ).transform('EPSG:4326', 'EPSG:3857')); var circle = new ol.layer.Vector({ source: new ol.source.Vector({ features: [ $scope.circleFeature ] }), style: [ new ol.style.Style({ fill: new ol.style.Fill({ color: 'rgba(76, 181, 248, 0.2)' }) }) ] });How come the iconFeature is moving fine but the circleFeature isn't?
أكثر...
I have a map which is working and I have added a Vector (icon) which is also working. I have made a circle with the same center as the icon which also works.
Now when the user clicks on a button I want that icon and circle to move to a new location which works for the icon but the not circle using:
$scope.iconFeature.getGeometry().setCoordinates(ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857'));$scope.circleFeature.getGeometry().setCoordinates(ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857'));The iconFeature is implemented using:
var iconFeatures=[];$scope.iconGeometry = new ol.geom.Point(ol.proj.transform([long, lat], "EPSG:4326", "EPSG:3857"));$scope.iconFeature = new ol.Feature({ geometry: $scope.iconGeometry,});iconFeatures.push($scope.iconFeature);var vectorSource = new ol.source.Vector({ features: iconFeatures});var iconStyle = new ol.style.Style({ image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({ anchor: [16, 32], anchorXUnits: 'pixels', anchorYUnits: 'pixels', opacity: 1, src: 'img/positions_marker.png' }))});The circleFeature is implemented using:
$scope.circleFeature = new ol.Feature( new ol.geom.Polygon.circular( new ol.Sphere(6378137), [long, lat], 600, 64 ).transform('EPSG:4326', 'EPSG:3857')); var circle = new ol.layer.Vector({ source: new ol.source.Vector({ features: [ $scope.circleFeature ] }), style: [ new ol.style.Style({ fill: new ol.style.Fill({ color: 'rgba(76, 181, 248, 0.2)' }) }) ] });How come the iconFeature is moving fine but the circleFeature isn't?
أكثر...