How to use DrawerJs

Drawing Polygons

  • Select Polygon from the toolbar.
  • The cursor turns into a cross with an informational tooltip next to it.
  • Furthermore, a border color picker and a border style selection will show up at the bottom.
  • The most recently selected color is already preselected.
  • In the upper right corner, you'll see a button for stopping the drawing of your polygon.
Start drawing a polygon.
  • Click anywhere on the canvas to start your polygon at that position.
Make the next line of the polygon.
  • Keep adding more lines to your polygon by clicking on the canvas.
Make the next line of the polygon.
Make the next line of the polygon.
  • Press Esc or click the stop button in the upper right corner to finish your polygon.
Your polygon is done.
  • Drawing polygons on touch devices is dead simple. Option #1:
    • To start drawing, make a single tap on the canvas element.
    • At the target position of the first line, make the second tap.
    • Every single tap will draw a new line of the polygon.
    • Top stop drawing, tap on the stop button.

  • Option #2:
    • To start drawing, tap on the canvas element and move your finger to the target position.
    • At the target position, release your finger.
    • Tap on the canvas element again and move your finger to draw as many lines as you like.
    • Top stop drawing, tap on the stop button.

Drawing a Polygon