user339108
user339108

Reputation: 13131

canvas library for drawing images

HTML5 canvas provides lots of flexibility to draw images using javascript. We need to generate javascript code based on inputs from the user (say something like 10 balls of blue color, 5 squares of green color and of a certain size ...). Is there an library which provides appropriate Javascript API(s) so that it is easier to generate the canvas along with the javascript code for requirements listed above?

Upvotes: 3

Views: 3825

Answers (1)

kangax
kangax

Reputation: 39208

With Fabric.js it's quite trivial to draw simple shapes (circles, rectangles, etc.) on canvas. It also supports image importing and manipulation.

Displaying rectangle, for example is as easy as:

var canvas = new fabric.Canvas('id_of_canvas_element');

var rect = new fabric.Rect({
  top: 100,
  left: 100,
  width: 60,
  height: 70,
  fill: 'red'
});

canvas.add(rect);

Take a look at demos.

Upvotes: 6

Related Questions