CODEWITHSUNDEEP
javascripthtmlgoogle-maps
Amja
Amja

Reputation: 1387

Can I control a js google map's panning by dragging another element?

I have two divs, one on top of the other. The bottom one contains the JS google map. The top one contains text and has a transparent background. Is there any way to control the panning of the map by dragging the top element?

Upvotes: 1

Views: 93

Answers (1)

Alex
Alex

Reputation: 2800

You could use some javascript with the Google Maps Api commands, in this case I believe you would need to use map.panBy(). You could assign this command to a drag action on the div using something like this:

var isDragging = false;
$("a")
.mousedown(function() {
    $(window).mousemove(function() {
        isDragging = true;
        $(window).unbind("mousemove");
    });
})
.mouseup(function() {
    var wasDragging = isDragging;
    isDragging = false;
    $(window).unbind("mousemove");
    if (!wasDragging) { //was clicking
        $("#throbble").show();
    }
});

Sources:

Can you detect "dragging" in jQuery?

http://www.daveoncode.com/2008/11/17/playing-with-google-maps-api-part-two-create-custom-controls/

Upvotes: 1

Related Questions