Knowing when KML file has loaded and features added (OpenLayers3)? - openlayers-3

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
}
});

Related

Why does Adobe Analytics call fail to fire even though DTM Switch shows the Satellite call?

I'm trying to attach a DTM Event Based Rule to a Social Share button from Add This, and it's not working.
I have other rules on the same page which are working fine, so I'm confident all the setup basics are correct.
In fact it almost works... In the log below... why does DTM Switch report event13 but then it doesn't show up in the Adobe Analytics Server Call?
Still not fully clear why it partially works (as opposed to not working at all), but the problem seems to be caused by attempting to bind Event Based Rules to elements that were injected into the DOM via Javascript (such as the AddThis API).
Solved by using a custom event handler to dispatch a Direct Call Rule:
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function(event) {
onElementInserted("body", '.at-share-btn', function(element) {
$(element).one('click', function() {
var network = $($(this).find('title')[0]).text();
window.digitalData.event.socialNetwork = network;
_satellite.track('social-network');
return true;
});
});
});
</script>
where onElementInserted() is borrowed from jquery detecting div of certain class has been added to DOM
Is it an s.tl() beacon? Is event13 set in custom code? I'd doublecheck that s.linkTrackEvents is set to allow event13- see Omniture events is not firing/sending data via DTM when using s.tl tracking methods for more info on that.

Open Layers 3: How to create listener for a modify interaction

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

How to watch for changes in window.location with Dart?

I would like to watch for changes in window.location with Dart but haven't found how to do it. Is there an event I can use or some other way to do it?
I'm guessing you want when the hash changes, because if window.location is changed it loads a new page. Try this:
import "dart:html";
window.onHashChange.listen((HashChangeEvent e) {
//Do stuff
});
window.onPopState.listen((PopStateEvent e) {
//Do stuff
});
PopStateEvent API: http://api.dartlang.org/docs/releases/latest/dart_html/PopStateEvent.html
A popstate event is dispatched to the window every time the active history entry changes between two history entries for the same document. If the history entry being activated was created by a call to history.pushState() or was affected by a call to history.replaceState(), the popstate event's state property contains a copy of the history entry's state object.
https://developer.mozilla.org/en-US/docs/Web/API/Window.onpopstate

How to register map move / map pan events in OpenLayers 3

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

Why isn't the keydown event firing?

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);

Resources