HTML5 Draw

Invoke the path method of the jqxDraw. Author: http://jqwidgets.com

by jqwidgets

HTML

<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<div id='jqxDraw' style="width:680px; height:300px;"></div>

JavaScript

$('#jqxDraw').jqxDraw({
      renderEngine: 'HTML5'
  });
  var renderer = $('#jqxDraw').jqxDraw('getInstance');

  // draw a path
  // params: line command ('d'), attributes
  var path = renderer.path("M 100,100 L 150,130 C 130,130 180,190 150,150", {
      stroke: '#777777',
      fill: 'red'
  });

  /* Supported line commands:
    MoveTo: M x,y
    LineTo: L x,y
    Cubic curve: C x1,y1,x2,y2,x,y
    Close path: Z
    */
  renderer.refresh();