Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

For reference I am using arcgis_js_v33 api.

I am trying to figure out a good way to detect if a user has hovered over the map for at least one second and if they have to pop up the info box identifying what is under their cursor. My issues seems to be that I cannot find a good way to start a timer if they stop moving their mouse and to kill the timer if they move their mouse before the timer reaches its time.

Any ideas?

share|improve this question
    
Have you tried the "onHover" event? It's built into javascript to detect mouse hovers. –  Jay Guarneri Feb 27 '13 at 15:26
add comment

1 Answer 1

up vote 3 down vote accepted

You could connect the map's "onMouseMove" event to a setTimeout function that would show the popup. Also, use the clearTimeout to stop the countdown whenever the mouse is moved. Here's some example code.

function onMapLoaded(map) {
    var timeOutAction;
    dojo.connect(map, "onMouseMove", function (e) {
        // reset the previous timeout that would call for the popup.
        if (timeOutAction !== undefined) {
            // if timeOutAction is not null or undefined, clear it out.
            window.clearTimeout(timeOutAction);
        }
        // use setTimeout to run the function that shows the popup after 1 second.
        timeOutAction = window.setTimeout(function () {
            /* perform identification of map using point e.mapPoint */
        }, 1000); // 1000 milliseconds = 1 second.
    });
    // when the mouse moves off the screen, reset the timeout function.
    dojo.connect(map, "onMouseOut", function (e) {
        window.clearTimeout(timeOutAction);
    });
}
share|improve this answer
    
There doesn't seem to be a standard for the return value of setTimeout or setInterval, so I don't think there's any guarantee it won't be 0. So you probably want to do something other than a coercive truthy check in if(timeOutAction), e.g. don't define timeOutAction and check if(typeof window.timeOutAction === 'undefined'). Also (and more importantly) var timeOutAction won't be in scope when your onMouseMove handler is executed - it's tied to the function but your handler will have global scope –  tomfumb Feb 27 '13 at 17:05
    
Thanks for the first part. I've edited my code to check whether the timeOutAction is undefined. As for second point about scope, because the function that runs after setTimeout fires was defined within the onMapLoaded function, it's scope includes anything else inside the onMapLoaded function. I've tested it, and it works just fine. –  raykendo Feb 27 '13 at 17:18
    
You guys are amazing! Thank you, it worked perfectly. –  archerne Feb 27 '13 at 18:00
    
hmm good point, I figured because you weren't creating a closure the scope would be lost –  tomfumb Feb 27 '13 at 18:10
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.