Drag objects in canvas

Rigil picture Rigil · Dec 30, 2010 · Viewed 42.2k times · Source

Im looking for an easy to use method of assigning drag behavior to multiple objects (images, shapes etc) in canvas. Does anyone have a good way or know of any libraries for dragging objects around? Thanks

Answer

Zevan picture Zevan · Dec 31, 2010

Creating your own mouse events takes a little work - ideally you should either create or use some kind of mini-library. I'm thinking of creating something like this in the near future. Anyway, I created a drag and drop demo on jsFiddle showing how to drag images - you can view it here.

You can create draggable images like this:

var myImage = new DragImage(sourcePath, x, y);

Let me know if you have any questions about this. Hope it helps.

EDIT

There was a bug when dragging multiple images. Here is a new version.

Another thing you might want to check out is easeljs it sort of in the style of AS3... mouseEvents dragging etc...