CODEWITHSUNDEEP
javascriptweb-applicationsdrawingpaint
Myna
Myna

Reputation: 559

Technologies for writing a web Paint program

I would like to do a a web Paint program. Basically I would like to mimic the Windows Paint program in a web application.

The features that I don't really know how to implement are:

  1. the drawing of 2D shapes (line, circle, etc) in a web browser
  2. drag and drop
  3. resize dynamically (seeing preview as you are moving the mouse for resizing)

I am guessing there will be HTML5, CSS3 and Javascript. I am mainly wondering if there are Javascript libraries that I could use to make my life easier.

Best regards

Upvotes: 6

Views: 2790

Answers (1)

GitaarLAB
GitaarLAB

Reputation: 14645

Yes, you want to use canvas (the 'new flash'). It is a HTML5 element widely supported in newer (mobile) browsers.

Here are some links to get you started:
a complete ms-paint copy salvaged from the archive (last one I could find)
http://mudcu.be/sketchpad/
http://dev.opera.com/articles/view/html5-canvas-painting/
http://www.codeproject.com/Articles/355230/HTML-5-Canvas-A-Simple-Paint-Program-Touch-and-Mou

Some popular library's are:
fabric.js, KineticJS and Processing.js

Good luck!

Upvotes: 4

Related Questions