angular-openlayers-directive
angular-openlayers-directive copied to clipboard
How to use Overlay
Does someone have a example for me how to use overlay without marker, please?
Example:
$scope.$on('openlayers.map.singleclick', function(event, data) {
// open overlayer in data['coord'] position
});
I already managed to get it working in conventional way(but sometimes there is a easier way to do it)
var container = document.getElementById('popup');
var content = document.getElementById('popup-content');
var closer = document.getElementById('popup-closer');
var overlay = new ol.Overlay(({
element: container,
autoPan: true,
autoPanAnimation: {
duration: 250
}
}));
closer.onclick = function () {
overlay.setPosition(undefined);
closer.blur();
return false;
};
olData.getMap().then(function (nativeOl3Map) {
// access the native ol3 map here
nativeOl3Map.addOverlay(overlay);
});
vm.click_position = [];
$scope.$on('openlayers.map.singleclick', function(event, data) {
vm.click_position = data['coord']
});
$scope.$on('openlayers.layers.geojson.click', function (event, feature) {
$scope.$apply(function () {
if (feature) {
var props = feature.getProperties();
if(props['type'] === 'shape') {
overlay.setPosition(vm.click_position);
}
}
});
});