Canvas is Mozilla's implementation... IE doesn't support that however. A JQ drawing lib would be great but quite a pain in the ass to code so it was cross browser.
-----Original Message----- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Bryan Buchs Sent: Friday, October 27, 2006 11:14 AM To: jQuery Discussion. Subject: Re: [jQuery] Oooh! These are pretty! I might be wrong, but isn't that what Canvas is for? Drawing shapes? > Sam, > > Yes, some thing like that would be great. It would also be nice to > handle arrays of locations without the 'px' so it is easy to do math on > them. > > // place a circle at the center of some container > $("#container").drawShape("circle", { origin: "centre", radius: 30}) > > // draw a circle > $("#container").drawShape("circle", { origin: [5,8], radius: 30}) > > // draw multiple circles and style them all the same > $("#container").drawShape("circle", { origin: [[5,8],[30,45],...], > radius: 30, style: {color: "red", opacity: .5, border-color: #900, > border-style: "solid"}}) > > // draw a polyline > $("#container").drawShape("line" { path: [[5,8],[30,45],...], style: > {color: "red", line-style: "dashed", lineWidth: 2}}).bind("mouseover", > function(e){alert("I'm a line");}); > > I also think there is something to be said for creating shape objects like: > > var redcircle = { > id: "circle01", > type: "circle", > x: 5, > y: 8, > radius: 30, > style: {color: #f00;}, > }; > var bluecircle = { > id: "circle02", > type: "circle", > x: 5, > y: 8, > radius: 10, > style: {color: #00f;}, > }; > var shapes = []; > shapes.push(redcircle); > shapes.push(bluecircle); > > // add to circles, then hide the larger > $("#container").addShape(shapes); > $("#circle01").hide(); > > or > > // add two circles (nested), then hide both of them > $("#container").addShape(redcircle); > $("#circle01").addShape(bluecircle); > $("#circle01").hide(); > > Anyway you get the idea. > > -Steve > > Sam Collett wrote: >> On 27/10/06, Stephen Woodbridge <[EMAIL PROTECTED]> wrote: >>> <snip> Since a lot of what I >>> do it maps and building apps on top of maps, I would really be able to >>> use some generic tools for drawing that are fast, cross browser and >>> capable of handling more than a few dozen points or objects.</snip> >> So I guess what you want a a shape drawing plugin? That could be >> useful and I could imaging a syntax similar to this: >> >> // draw a circle in the centre of #container >> $("#container").drawShape("circle", { origin: "centre", radius: "30px"}) >> >> // draw a circle in the 5px from the left and 8px from the top, >> cropped when it reaches the edge (so you get a partial circle) >> $("#container").drawShape("circle", { origin: {left: "5px", top: >> "8px"}, radius: "30px" }) >> >> // draw a rectangle in the centre >> $("#container").drawShape("rectangle", { origin: "center", width: >> "30px", height: "35px" }) >> >> Other shapes could perhaps be added as well (triangles, trapezoids >> etc). Some shapes are under several categories (a square is a >> rectangle and a rohmbus). However, I have no idea how to implement >> something like this. >> >> _______________________________________________ >> jQuery mailing list >> [email protected] >> http://jquery.com/discuss/ > > > _______________________________________________ > jQuery mailing list > [email protected] > http://jquery.com/discuss/ _______________________________________________ jQuery mailing list [email protected] http://jquery.com/discuss/ _______________________________________________ jQuery mailing list [email protected] http://jquery.com/discuss/
