Cool. You might want to take a look at how dojox.gfx does it, for example, here:
http://archive.dojotoolkit.org/nightly/dojotoolkit/dojox/gfx/demos/circles.html Important code: function makeCircleGrid(itemCount){ var minR = 10, maxR = surface_size.width / 3; for(var j = 0; j < itemCount; ++j){ var r = getRandSkewed(minR, maxR), cx = getRand(r, surface_size.width - r), cy = getRand(r, surface_size.height - r), shape = surface.createCircle({cx: cx, cy: cy, r: r}) .setFill(randColor(true)) .setStroke({color: randColor(true), width: getRand(0, 3)}) ; *new dojox.gfx.Moveable(shape);* } } So you basically just instantiate a new shape, and use it to instantiate a new Moveable. Pretty clean design, I think, Jake On Wed, Oct 8, 2008 at 8:56 AM, narendra sisodiya < [EMAIL PROTECTED]> wrote: > On Wed, Oct 8, 2008 at 4:48 PM, ddailey <[EMAIL PROTECTED]> wrote: > > > Take a look at > > http://srufaculty.sru.edu/david.dailey/svg/makeDragDrop.svg > > > > It doesn't use any external .js, but has relatively simple code and seems > > to > > work pretty much everywhere. > > > > David > > > > ----- Original Message ----- > > From: "narendra sisodiya" <[EMAIL PROTECTED] > <narendra.sisodiya%40gmail.com> > > > > > To: <[email protected] <svg-developers%40yahoogroups.com>> > > Cc: "Keith Wood" <[EMAIL PROTECTED]<kbwood% > 40virginbroadband.com.au> > > > > > Sent: Wednesday, October 08, 2008 1:46 AM > > Subject: [svg-developers] Magic: SVG drag of Element using jquery svg is > > most simple > > > > Here is a small code segment which give me highest programmability in > svg, > > This need jquery and its svg plugin , It will work in firefox > > Please comment on it,, how can i make it better, and cross browser. > > ------------------------------- > > you need these files > > jquery.js , jquery.svg.js , jquery.svg.css > > -------------------------------------------------------- > > most surprisable thing about the code, -- > > I am calling external function directly and I am using jquery object > > $('#mycircle') where id belong to svg element, > > This small code give me very surprise ,, and it is working,, > > ---------------------------------------------------------- > > <html> > > <head > > > <script type="text/javascript" src="jquery.js"></script> > > <script type="text/javascript" src="svg/jquery.svg.js"></script> > > <style type="text/css"> > > @import "svg/jquery.svg.css"; > > .canvas1 > > { > > position: relative; > > height: 400px; > > width: 600px; > > background: #ffffcc; > > border: #ff0000; > > } > > > > </style> > > > > <script type="text/javascript"> > > > > var start_drag = null ; > > var offsetx =null ; > > var offsety =null ; > > > > $(document).ready(function() { > > > > $('#svgintro').svg({onLoad: drawIntro}); > > > > }); > > > > function now_drag(evt){ > > if (start_drag==1){ > > $('#mycircle').attr('cx').baseVal.value = evt.layerX - offsetx; > > $('#mycircle').attr('cy').baseVal.value = evt.layerY - offsety; > > } > > } > > > > function start_dragging(evt){ > > start_drag = 1; > > offsetx = evt.layerX - $('#mycircle').attr('cx').baseVal.value ; > > offsety = evt.layerY - $('#mycircle').attr('cy').baseVal.value ; > > > > } > > function stop_dragging(evt){ > > start_drag = 0; > > > > } > > > > function drawIntro() { > > var svg = $('#svgintro').svg('get'); > > svg.describe("Example script01 - invoke an ECMAScript function from an > > onclick event"); > > svg.circle(300, 150, 50, { > > onmousedown:"start_dragging(evt)", > > onmouseup:"stop_dragging(evt)", > > onmousemove:"now_drag(evt)", > > id:"mycircle", > > fill:"red"}); > > svg.text(300, 280, "Drag It", > > {'font-family':"Verdana", > > 'font-size':20, > > 'text-anchor':"middle" > > }); > > } > > </script > > > </head > > > <body > > > <div id="remove">this line of text is useless like my friends</div> > > <div class="canvas1" id="svgintro" ></div> > > </body> > > </html> > > > > -- > > ,???[ Narendra Sisodiya ]??????????????f > > http://narendra.techfandu.org > > http://www.lug-iitd.org > > "????????????[ +91-93790-75930 ]??????. > > > > [Non-text portions of this message have been removed] > > > > ------------------------------------ > > > > ----- > > To unsubscribe send a message to: > > [EMAIL PROTECTED]<svg-developers-unsubscribe% > 40yahoogroups.com> > > -or- > > visit http://groups.yahoo.com/group/svg-developers and click "edit my > > membership" > > ----Yahoo! Groups Links > > > > > > > > > Yes, I have already seen this demo code,, > I wanted to use power of jQuery and it is visible by code itself, > second this , i like do not want things in svg files, having all functions > in javascript file of html doc is very useful to do task , because my > application will be LAMP based final rendered image i have to show in a div > container. > -- > [ Narendra Sisodiya ] > http://narendra.techfandu.org > http://www.lug-iitd.org > [ +91-93790-75930 ] > > > [Non-text portions of this message have been removed] > > > ------------------------------------ > > ----- > To unsubscribe send a message to: > [EMAIL PROTECTED] > -or- > visit http://groups.yahoo.com/group/svg-developers and click "edit my > membership" > ----Yahoo! Groups Links > > > > [Non-text portions of this message have been removed] ------------------------------------ ----- To unsubscribe send a message to: [EMAIL PROTECTED] -or- visit http://groups.yahoo.com/group/svg-developers and click "edit my membership" ----Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/svg-developers/ <*> Your email settings: Individual Email | Traditional <*> To change settings online go to: http://groups.yahoo.com/group/svg-developers/join (Yahoo! ID required) <*> To change settings via email: mailto:[EMAIL PROTECTED] mailto:[EMAIL PROTECTED] <*> To unsubscribe from this group, send an email to: [EMAIL PROTECTED] <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
