1

I'm making a page that lays out a grid of white square polygons over an area in Google Earth. When you click on one it changes color to brown, and clicking again changes it back to white. I'm trying to get it so when you mousedown and mousemove, whatever polygons you mouseover change to brown too. Here's how I have my event listeners set up:

google.earth.addEventListener(ge.getGlobe(), 'mousedown', function(event) {

        var placemark = event.getTarget();

        if (placemark.getType() == 'KmlPlacemark' &&
                placemark.getGeometry().getType() == 'KmlPolygon') {
                event.preventDefault();
                event.stopPropagation();
                mbutton = true;
                console.log(mbutton);

                var lcolor = placemark.getStyleSelector().getLineStyle().getColor();
                var pcolor = placemark.getStyleSelector().getPolyStyle().getColor();

                if ( lcolor.get() == "ffffffff") {
                        lcolor.set('ff00008B');
                        pcolor.set('ff00008B');
                } else {
                        lcolor.set('ffffffff');
                        pcolor.set('ffffffff');
                }
        } 
});

for ( var i = 0; i < placemarks.length; i++ ) {
        google.earth.addEventListener(placemarks[i], 'mouseover', function(event) {
                if (mbutton) {
                        console.log('over' + event.getTarget().getId());

                        $(placemarks[i]).trigger('mousedown');
                } else {console.log('not: ' + event.getTarget().getId())}
        });
}

google.earth.addEventListener(ge.getGlobe(), 'mousemove', function(event) {
        if (mbutton) {
                console.log(event.getTarget().getId() + ' : ' + event.getTarget().getType());
                event.preventDefault();
                event.stopPropagation();

        }
});

google.earth.addEventListener(ge.getGlobe(), 'mouseup', function(event) {
        if (mbutton) {
                mbutton = false;
                console.log(mbutton);
        }
});

The problem is that it looks like whatever polygon the user mousedowns will be the only polygon that mousemove will see, and mouseover won't fire at all unless the user mouseups over a polygon, as if in the split second that the mouse button isn't down the mouseover had a chance to fire. Here's the output of the debugging info from the event listeners in Chrome:

1: true createRaster.js:307
2: 1 : KmlPlacemark createRaster.js:338
3: 1 : KmlPlacemark createRaster.js:338
4: [truncated for brevity]
5: 1 : KmlPlacemark createRaster.js:338
6: over2 createRaster.js:329
7: false

This is from mousedowning on the first polygon (line 1) and moseovering to the second (lines 2-6) and mousupping (line 7). The entire time the mousemove is firing it stays with the target the user clicked on initially. When the button is mouseupped, in the split second before the mouseup event fires the mouseover event.

Shouldn't the mouseover event fire whether or not the mouse button is down? Is something in my code blocking this event from firing?

4

1 回答 1

1

像这样的东西：

var clicking = $(window).on("mousedown", function (e) {
    return true;
    e.preventDefault();
});

$(target).on("mouseover", function () {
    while (clicking == true) {
        doTheThing();
    }
});
于 2013-09-28T16:41:02.490 回答