Drawing rectangles on a grid in a web browser

Question

I would like to create an online, simple WYSIWYG drawing editor allowing people to draw rectangular shapes. I'm thinking of a grid which the lines and points can snap on to, ensuring that the lines are strictly vertical or horizontal. I will be parsing the rectangular shapes to obtain some area calculations and compute certain things. How can I achieve the drawing ability? The new canvas tag is good but people have been telling me that IE does not support it. I found some Java applets but I have never programmed in Java before. Is there a way to do this using pure javascript or jquery? Does ASP.NET help at all?

Thanks.

Answer 1

You're absolute best bet is to learn flash or silverlight. Trying to do this in plain old html / javascript is going to be a huge PITA... if you even get it working.

Answer 2

For vertical and horizontal lines you can simply use thin divs with a background, defined size and absolute position. Really simple to code and will work everywhere. You'd need canvas for anything more than strictly vertical/horizontal ones though.

Answer 3

You can definetly use canvas, and emulate it on IE with one of the libs:
http://code.google.com/p/gwt-canvas/
http://excanvas.sourceforge.net/
But take care on performance. Chris Lively has a point.