What are some of the best ways to plot/draw vector graphics on a HTML page?

I'm trying out some dynamic web page background generation using lines and text.

Take a look at my demo at http://74er.net/labs/lines.html (just focus on the yellow line).

It's a lame and inefficient method by literally creating a <span> element with 1 X 1 size and a yellow background with the X,Y position based on an ellispe formula.

My requirements is for the line creation are fairly simple (or rather 开发者_StackOverflow社区straightforward):

• must be created at client-side and not a dynamic image generated by server scripts
• can be created based on a simple formula (circle, ellispe or just a straight line)
• can be contained in a DOM element (e.g. DIV so that I can layer it as a background)
• No HTML5 canvas technique (simply because it should be rendered on non-HTML5 compliant browsers)
• Not too taxing on the browser like my current implementation

There's not need for:

• really smooth curves (though that will be welcomed)
• dotted/dashed (I'll like that as well if feasible)

Based on the above, I am almost certain SVG (with Raphaël) is the way to go BUT I am put off by lack of native SVG support in some browsers.

I have looked at Walter Zorns library, and it is has some excellent performance tuning algorithms built-in. So it'll be my choice if I can't find a more creative implementation.

Let me know if you need further clarification.

---

Morning,

i have enjoyed to work with the drawing features from the Dojo Toolkit. You can see it in action here:

Dojo drawing example

To Download Dojo visit:

Dojo Toolkit