7. obfc.js: free_draw and free_write functions

This post introduces two function in obfc.js: free_draw and free_write functions. If you don’t like draw of Line function, you can draw free line easily with free_draw function. Moreover, free_write function can be used for write text into the SVG element. 


This function has three parameters: path definitions, start points, stroke color.

free_draw(path_definitions, start_position, _stroke_color)

In path definition: you can draw line to up(u), down(d), left (l) and right for a given length. Line starts a [x, y] points. Moreover, you can set color of lines. For example:


The first free_draw function starts x=200 and y=30, then go left 80px, down 220 px and finally left 115px. You can set open_ruler = true for better design.


This function has 8 parameters:

free_write(_text, _text_size, _font_weight, _middle_x, _middle_y, _height, _align, _text_color)

  • _text can be a string value or a string array value. _text_size  specifies the size of the _text.
  • _font_weigth parameter sets how thick or thin characters in _text should be showed. (For more information click this link)
  • _middle_x, _middle_y: sets points of _text.
  • _heigth can be useful for _text which contain multiline value. (string array)
  • _align: default value is centre of _middle_x and _middle_y.
  • _text_color: determines color of _text.