resize and draggable the group of the SVG element

I am working on a SVG application and now want to let a user resize an object using draggable corners, very much li开发者_如何学JAVAke in SVG-edit (http://svg-edit.googlecode.com/svn/trunk/editor/svg-editor.html). The functionality should work as follows: The user selects an SVG object, drags it to the main ‘canvas’ and once on the ‘canvas’, four corners on the outside of the object appear, the user can drag on each of the corner points & drag to enlarge the object. The objects will be rectangular in shape and created using paths, not using the SVG ‘rect’ function. Would anyone have any suggestions as to how this should be implemented? Thanks in Advance

You could take a look at some existing open source implementations. svg-edit is one which you already mentioned.

To showcase a tool that I developed, I wrote a demo which implements this functionality. This which may serve as a simpler and more restrictive example than svg-edit, as it doesn't do too much other than allow you to draw rects and circles, and rotate/translate/scale them.

I have edited jquery to make rect draggable, recently put them in a g and lost this functionality. The g doesn't contain the position data. Might be possible to bubble down to the children elements.