Drawing rectangles on a grid in a web browser

Posted by Dhruv on Stack Overflow See other posts from Stack Overflow or by Dhruv
Published on 2010-03-11T20:23:48Z Indexed on 2010/03/11 20:34 UTC
Read the original article Hit count: 195

Filed under:

drawing

|

wysiwyg

|

applet

|

web-development

|

jQuery

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.

© Stack Overflow or respective owner

Related posts about drawing

Designer issue in VS: Events cannot be set on the object passed to the event binding service ...

as seen on Stack Overflow - Search for 'Stack Overflow'
I have a little problem: the Winform control (that contains between others WPF) suddenly stopped to be displayed in Designer. Message: Events cannot be set on the object passed to the event binding service because a site associated with the object could not be located. Call Stack: … >>> More
Drawing continuously in drawing application

as seen on Stack Overflow - Search for 'Stack Overflow'
I was wondering how drawing applications draw the entire time the mouse is down without having empty gaps. What I mean is, for example if the program only drew circles at the mouse's X, y coordinate, then if the mouse went too quicly it would seem like a bunch of little circles rather than a nice… >>> More
Project compile perfectly but i get unhandled exception and have no idea why??? any clues?

as seen on Stack Overflow - Search for 'Stack Overflow'
get unhandled exception that says: System.NullReferenceException: Object reference not set to an instance of an object. at Eagle_Eye_Class_Finder.GetSchedule.GetDataFromNumber(String ID) in C:\Users\Joshua Banks\Desktop\EET Project\Eagle Eye Class Finder\GetSchedule.cs:line 24 at Eagle_Eye_Class_Finder… >>> More
Have a program/winform that outputs name and classes in message box, my objective is to write the cl

as seen on Stack Overflow - Search for 'Stack Overflow'
Here is my Get Schedule Class: using System; using System.IO; using System.Data; using System.Text; using System.Drawing; using System.Data.OleDb; using System.Collections; using System.ComponentModel; using System.Windows.Forms; using System.Drawing.Printing; using System.Collections.Generic; namespace… >>> More
drawing hierarchical tree with orthogonal lines ( HV-Drawing – Binary Tree)

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi I need to work on drawing a hierarchical tree structure (HV-Drawing – Binary Tree) with orthogonal lines(straight rectangular connecting lines) between root and children ( like the following: http://lab.kapit.fr/display/visualizationlayouts/Hierarchical+Tree+layout ). I want to know if there are… >>> More

Related posts about wysiwyg

jQuery + InnovaStudio WYSIWYG Editor

as seen on Stack Overflow - Search for 'Stack Overflow'
I am trying to avoid hard-coding each instance of this WYSIWYG editor so I am using jQuery to create an each() loop based on function name. Annoyingly InnovaStudio seems to explode when I try. Documentation Attempt #1 <script type="text/javascript"> /* id = $(this)… >>> More
Inserting Google Maps into a WYSIWYG editor, then saving and retrieving properly

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, I'm trying to extend jWysiwyg with an function to add a map from Google Maps. I can get the map all right, but I'm having problems with how to handle the generated map so it can be saved with the page and then retrieved. To open the process up a bit: User enters editor which is created using… >>> More
Copying Pasting Word 2007 docs to HTML WYSIWYG editors

as seen on Stack Overflow - Search for 'Stack Overflow'
Microsoft word has a ton of proprietary formatting and styles that do not translate well to html WYSIWYG editors. When you paste them over to the html editor and try to edit the pasted info it causes all kinds of clashing styles. I want to be able to keep the general structure but leave out the… >>> More
Using QT to build a WYSIWYG Editor for a Custom Markup Language

as seen on Stack Overflow - Search for 'Stack Overflow'
I'm new to QT, and am trying to figure out the best means of creating a WYSIWYG editor widget for a custom markup language that displays simple text, images, and links. I need to be able to propagate changes from the WYSIWYG editor to the custom markup representation. As a concrete example of the… >>> More
embeding youtube video to content in wysiwyg editor

as seen on Stack Overflow - Search for 'Stack Overflow'
i have an editor that is basic microsoft actions: "createlink" "bold" etc. i made page to handle the youtube embeding and it works fine on the website. but in the editor all i can see is the rectangle of the video with nothing in it. the editor is an iframe editable that get the content from another… >>> More