A cross-browser canvas approach is possible:
http://me.eae.net/archive/2005/12/29/canvas-in-ie/
olivvv
Alex Cook wrote:
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/
|
