Main Page

From LiThA-Wiki

LiThA-Paint web-drawing service

Javascript API for LiThA-Paint has been released.
That means that any webpage can have the same drawing canvas embedded like the one on [LiThA-Paint editor]. Simple example of LiTha-Paint integration you can see [here]. You can copy'n'paste sourcecode of this example into your website, it will work well.

In order to use LiThA-Paint canvas on your web page, please follow these easy steps:

• include litha.js file into your page using the following code:

  <script src="http://www.litha-paint.com/api/litha.js"></script>

• include wz_jsgraphics.js using the following code:

  <script src="http://www.litha-paint.com/api/wz_jsgraphics.js"></script>

• include css for context menu using the following:

  <link rel="stylesheet" type="text/css" href="http://www.litha-paint.com/api/css/style.css">

• disable default image toolbar by setting imagetoolbar variable to "no" in meta tags. That should look like:

  <meta http-equiv="imagetoolbar" content="no" />

• anywhere on the page create layer (<div> tag) that will serve as a placeholder for our drawing canvas.

  <div id="mycanvas"</div>

• declare some variable in the global scope of your html page that will contain drawing canvas object.

  var canvas;

• instantiate that variable with Paint javascript object using the following constructor: new Paint (id of canvas placeholder, canvas width, canvas height, workspace width, workspace height, background color)

  canvas = new Paint ("mycanvas",700,700,500,500,"#CCCCCC");

• initialize created object using this function:canvas.init()

  canvas.init();

And that's it! Now you can call various functions of the canvas object depending on your needs. Visit LiThA-API page for complete list of functions and documentation.