Problem (or bug?) when using mousedown, mousemove, mouseup event to "Drag" the polygon

[Bossa]

Hi,

I'm trying to use mousedown, mousemove and mouseup event to drag the
polygon,
basically the idea is:
1. When the user click on the polygon, var moving = true;
2. When moving = true, the path of the polygon will keep updating and
follow the cursor
3. When the user release the left click, moving will become false.

Quite a simple logic, but it does not always works as expect,
when the cursor is moving slowly (around 50 to 100 pixel per second),
it works well,
but if the user drag it too quick, the mouseup event does not dispatch
and the polygon will stick to the cursor.

I am wondering if there is any solution to this case?
Thanks for helps

[Bossa]

(Seems this problem does not appear in Chrome, can try this on
Firefox...)

I wrote a simple sample using API v3,
please try this:

http://www.unusualhk.com/test/

is there any place I went wrong?

[Esa]

I would try using 'mousemove' of Map instead of Polygon.

I think that you lose mousemove if you move mouse faster than browser
can update the triangle. If you would switch to 'mousemove' of map,
you would still have the event data if the mouse pointer would go
outside the triangle.

[Bossa]

Thanks for reply,
I switched the mousemove event to the map's one,
but actually the problem is that the mouseup event of the polygon does
not dispatch after dragging a while,
and the polygon stick to the cursor all the time even user release the
mouse click...

I added a debug value at the top, and the value will increase by 1
when polygon mouseup event dispatch once.

[Esa]

You would need also a more reliable 'mouseup'. Unfortunately there is
no 'mouseup' on Map. You could use addDomListener() to map.getDiv() or
even to document.body.

Another trick might be to use 'mouseout' of Polygon in parallel with
'mouseup'.

[Bossa]

The program works well after I added an mouseup event for map using
addDomListener(),
thank you very much!