I have managed to set up a modify interaction.
The docs for ol.interaction.Modify (http://ol3js.org/en/master/apidoc/ol.interaction.Modify.html) don't metion a single event that is fired when a feature is modified.
Unlike for instance for ol.interaction.Draw (http://ol3js.org/en/master/apidoc/ol.interaction.Draw.html) which works nicely.
I need to update the coordinates in the database when a feature has been modified.
How can I set up a listener?
I found a solution.
The high-level-explanation is here: http://boundlessgeo.com/2014/06/openlayers-editing-wfs-t/
Basically you don't listen to changes in the modify-interaction (like you do in the draw-interaction). Instead, you listen to changes in the selected features themselves.
Here's a short extract:
// get the features from the select interaction
var selected_features = select_interaction.getFeatures();
// when a feature is selected...
selected_features.on('add', function(event) {
// get the feature
var feature = event.element;
// ...listen for changes on it
feature.on('change', function(event) {
// got it!
});
});
Here is a complete working example: http://codepen.io/barbalex/pen/fBpyb
for this, you have to use like following :
feature.once('change', function(bool) {if (bool) {document.getElementById('my_input_text').value='feature changed'}})
you have to use 'once' instead of 'on' to avoid multiple check and use boolean variable to check if feature is changed or not.
Hope this help
Related
I registered a 'moveend' event listener on my ol.Map. It's firing when the map is moved around by user input, but also when I call ol.View.setCenter and ol.View.setResolution.
Is it possible to check the 'moveend' ol.MapEvent to determine if the event was triggered by user input or from manually changing the map view's properties?
I ended up doing the following.
map.on('moveend', function(event) {
var mapView = map.getView(),
moveInitiatedProgrammatically = mapView.get('moveInitiatedProgrammatically') || false;
mapView.unset('moveInitiatedProgrammatically');
// evaluate moveInitiatedProgrammatically's value and behave accordingly...
});
map.getView().set('moveInitiatedProgrammatically', true);
map.getView().setCenter(coord);
It's not ideal for the following reasons:
Introduces additional state information in the map's view.
Carelessly replacing the map view will lose that state information.
Requires setting a property before changing the view state and may be too easily forgotten.
However, it adresses my issue in the meantime.
I want to add an onclick and an onchange event to all input fields inside a Polymer template.
Is there a way to add the events at once by code to all of them?
I want to avoid adding onclick and onchange attributes to the input fields one by one.
I think it must be possible, but I'm messing around with the code and I can't get it.
Thanks in advance
This is quite similar to Listen to events on ElementList with no explicit accessor. You might need a different selector but your question doesn't contain enough information to know what that might be. Maybe:
List<StreamSubscription> _clickSubscriptions = <StreamSubscription>[];
List<StreamSubscription> _changeSubscriptions = <StreamSubscription>[];
this.shadowRoot.querySelectorAll("input")
.forEach((e) {
_clickSubscriptions.add(e.on["on-click"].listen((event) {
print("Event Triggered");
}));
_changeSubscriptions.add(e.on["on-change"].listen((event) {
print("Event Triggered");
}));
});
to cancel the subscription use
_clickSubscriptions.forEach((s) => s.cancel());
_changeSubscriptions.forEach((s) => s.cancel());
See also How can you assign mutliple listeners to a single StreamSubscription?
I see that ol.source.KML (untick "Stable only") fires the events addfeature,
change and removefeature. However, I just need to know when the KML was retrieved over the network and all its features added. Is there an event like "loaded" or similar in OpenLayers 3?
I need to execute some code when the KML has been added. Waiting for document.ready is not enough as the KML file is loaded (over network) afterwards.
Listen to change event, check if the source state is ready, then do what you want, not forgetting to deregister your listener.
var key = source.on('change', function() {
if (source.getState() == 'ready') {
source.unByKey(key);
// do something with the source
}
});
I'm looking for OpenLayer 3 map event for map move/map pan, something like:
map.on('move', function(){
...
}
Does anyone know how to implement?
The moveend event might be the one you search for - it detects any move made, even those not invoked by dragging.
map.on('moveend', function (e) {
console.log("moved");
});
See http://openlayers.org/en/latest/apidoc/module-ol_Map-Map.html
UPDATE:
These events are no longer present in recent versions. Please refer to the more recent answer for an up-to-date information.
Names of the events you're looking for are drag and/or dragend (it's probably a better idea to depend on properties names, though: ol.MapBrowserEvent.EventType.DRAG but it didn't work on the demo page):
map.on('drag', function() {
console.log('Dragging...');
});
map.on('dragend', function() {
console.log('Dragging ended.');
});
Reverse-engineered by looking inside mapbrowserevent.js, the documentation explicitly mentions events are not documented yet.
MoveEnd trigger if u move the map with a script.
I have use that in OpenLayers 6:
map.on('pointerdrag', function (event) {
is_map_center = false;
})
hf gl!
I believe this functionality exists in 2 functions within the View of a map, not the map itself. You can monitor the center property of the View by listening for change:center events. There is also a getInteracting() method in ol.View that will return a boolean if an interaction (zooming or panning) is occurring.
https://openlayers.org/en/v4.6.5/apidoc/ol.View.html#getInteracting
I'm trying to attach an event handler to the keyDown event in a canvas element. Here is a simplified version of my code.
class CanvasFun{
CanvasElement canvas;
CanvasFun(this.canvas){
print("Game is loading!");
this.canvas.onKeyDown.listen(handleInput);
}
void handleInput(e)
{
//breakpoint is never hit
print(e.keyCode);
}
}
I've removed some of the drawing code. In my main function I simply query the canvas element and pass it to my CanvasFun constructor.
I've also tried doing it this way:
void main() {
var canvas = query("#Game");
canvas.onKeyDown.listen(handleInput);
var canvasFun = new CanvasFun(canvas);
}
void handleInput(e)
{
print(e.keyCode);
}
The reason why the event is not firing is because the focus is on the document (or some other element like an input, for example). And in fact, canvas element even when focused does not fire an event. Some elements do, like input elements.
The solution is to listen to key down events from the document or window:
window.onKeyDown.listen(handleInput);
document.onKeyDown.listen(handleInput); // You already noticed this worked.
John McCutchan has written a nice Dart package to help handle keyboard input. You can read more about it here: http://dartgamedevs.org/blog/2012/12/11/keyboard-input/
Note that this library helps you handle input "correctly". You do not want to do any "work" in the input handling, instead you simply want to register that a key was pressed. You can check the state of any key presses inside of your requestAnimationFrame callback.
Hope that helps!
There exists a workaround to get the canvas-element accept KeyboardEvents:
Problems handling KeyboardEvents on DartFlash
Once you add the tabindex-attribute to your canvas-element, it can get the focus and then it will receive KeyboardEvents.
It looks like I can get it to work if I register the event on the document rather than the canvas element.
document.onKeyDown.listen(handleInput);