mirror of
https://github.com/Hopiu/fabric.js.git
synced 2026-03-30 12:40:24 +00:00
3850 lines
87 KiB
HTML
3850 lines
87 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
|
|
<head>
|
|
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
|
<meta name="generator" content="JsDoc Toolkit" />
|
|
|
|
<title>JsDoc Reference - fabric.Canvas</title>
|
|
|
|
<style type="text/css">
|
|
/* default.css */
|
|
body
|
|
{
|
|
font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif;
|
|
width: 800px;
|
|
}
|
|
|
|
.header
|
|
{
|
|
clear: both;
|
|
background-color: #ccc;
|
|
padding: 8px;
|
|
}
|
|
|
|
h1
|
|
{
|
|
font-size: 150%;
|
|
font-weight: bold;
|
|
padding: 0;
|
|
margin: 1em 0 0 .3em;
|
|
}
|
|
|
|
hr
|
|
{
|
|
border: none 0;
|
|
border-top: 1px solid #7F8FB1;
|
|
height: 1px;
|
|
}
|
|
|
|
pre.code
|
|
{
|
|
display: block;
|
|
padding: 8px;
|
|
border: 1px dashed #ccc;
|
|
}
|
|
|
|
#index
|
|
{
|
|
margin-top: 24px;
|
|
float: left;
|
|
width: 160px;
|
|
position: absolute;
|
|
left: 8px;
|
|
background-color: #F3F3F3;
|
|
padding: 8px;
|
|
}
|
|
|
|
#content
|
|
{
|
|
margin-left: 190px;
|
|
width: 600px;
|
|
}
|
|
|
|
.classList
|
|
{
|
|
list-style-type: none;
|
|
padding: 0;
|
|
margin: 0 0 0 8px;
|
|
font-family: arial, sans-serif;
|
|
font-size: 1em;
|
|
overflow: auto;
|
|
}
|
|
|
|
.classList li
|
|
{
|
|
padding: 0;
|
|
margin: 0 0 8px 0;
|
|
}
|
|
|
|
.summaryTable { width: 100%; }
|
|
|
|
h1.classTitle
|
|
{
|
|
font-size:170%;
|
|
line-height:130%;
|
|
}
|
|
|
|
h2 { font-size: 110%; }
|
|
caption, div.sectionTitle
|
|
{
|
|
background-color: #7F8FB1;
|
|
color: #fff;
|
|
font-size:130%;
|
|
text-align: left;
|
|
padding: 2px 6px 2px 6px;
|
|
border: 1px #7F8FB1 solid;
|
|
}
|
|
|
|
div.sectionTitle { margin-bottom: 8px; }
|
|
.summaryTable thead { display: none; }
|
|
|
|
.summaryTable td
|
|
{
|
|
vertical-align: top;
|
|
padding: 4px;
|
|
border-bottom: 1px #7F8FB1 solid;
|
|
border-right: 1px #7F8FB1 solid;
|
|
}
|
|
|
|
/*col#summaryAttributes {}*/
|
|
.summaryTable td.attributes
|
|
{
|
|
border-left: 1px #7F8FB1 solid;
|
|
width: 140px;
|
|
text-align: right;
|
|
}
|
|
|
|
td.attributes, .fixedFont
|
|
{
|
|
line-height: 15px;
|
|
color: #002EBE;
|
|
font-family: "Courier New",Courier,monospace;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.summaryTable td.nameDescription
|
|
{
|
|
text-align: left;
|
|
font-size: 13px;
|
|
line-height: 15px;
|
|
}
|
|
|
|
.summaryTable td.nameDescription, .description
|
|
{
|
|
line-height: 15px;
|
|
padding: 4px;
|
|
padding-left: 4px;
|
|
}
|
|
|
|
.summaryTable { margin-bottom: 8px; }
|
|
|
|
ul.inheritsList
|
|
{
|
|
list-style: square;
|
|
margin-left: 20px;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.detailList {
|
|
margin-left: 20px;
|
|
line-height: 15px;
|
|
}
|
|
.detailList dt { margin-left: 20px; }
|
|
|
|
.detailList .heading
|
|
{
|
|
font-weight: bold;
|
|
padding-bottom: 6px;
|
|
margin-left: 0;
|
|
}
|
|
|
|
.light, td.attributes, .light a:link, .light a:visited
|
|
{
|
|
color: #777;
|
|
font-style: italic;
|
|
}
|
|
|
|
.fineprint
|
|
{
|
|
text-align: right;
|
|
font-size: 10px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<!-- ============================== header ================================= -->
|
|
<!-- begin static/header.html -->
|
|
<div id="header">
|
|
</div>
|
|
<!-- end static/header.html -->
|
|
|
|
<!-- ============================== classes index ============================ -->
|
|
<div id="index">
|
|
<!-- begin publish.classesIndex -->
|
|
<div align="center"><a href="../index.html">Class Index</a>
|
|
| <a href="../files.html">File Index</a></div>
|
|
<hr />
|
|
<h2>Classes</h2>
|
|
<ul class="classList">
|
|
|
|
<li><i><a href="../symbols/_global_.html">_global_</a></i></li>
|
|
|
|
<li><a href="../symbols/Array.html">Array</a></li>
|
|
|
|
<li><a href="../symbols/fabric.html">fabric</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Canvas.html">fabric.Canvas</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Canvas%23cache.html">fabric.Canvas#cache</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Circle.html">fabric.Circle</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Color.html">fabric.Color</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Element.html">fabric.Element</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Ellipse.html">fabric.Ellipse</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Gradient.html">fabric.Gradient</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Group.html">fabric.Group</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Image.html">fabric.Image</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Intersection.html">fabric.Intersection</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Line.html">fabric.Line</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Object.html">fabric.Object</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Path.html">fabric.Path</a></li>
|
|
|
|
<li><a href="../symbols/fabric.PathGroup.html">fabric.PathGroup</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Point.html">fabric.Point</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Polygon.html">fabric.Polygon</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Polyline.html">fabric.Polyline</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Rect.html">fabric.Rect</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Text.html">fabric.Text</a></li>
|
|
|
|
<li><a href="../symbols/fabric.Triangle.html">fabric.Triangle</a></li>
|
|
|
|
<li><a href="../symbols/fabric.util.html">fabric.util</a></li>
|
|
|
|
<li><a href="../symbols/fabric.util.array.html">fabric.util.array</a></li>
|
|
|
|
<li><a href="../symbols/fabric.util.object.html">fabric.util.object</a></li>
|
|
|
|
<li><a href="../symbols/fabric.util.string.html">fabric.util.string</a></li>
|
|
|
|
<li><a href="../symbols/Function.html">Function</a></li>
|
|
|
|
<li><a href="../symbols/String.html">String</a></li>
|
|
|
|
</ul>
|
|
<hr />
|
|
<!-- end publish.classesIndex -->
|
|
</div>
|
|
|
|
<div id="content">
|
|
<!-- ============================== class title ============================ -->
|
|
<h1 class="classTitle">
|
|
|
|
Class fabric.Canvas
|
|
</h1>
|
|
|
|
<!-- ============================== class summary ========================== -->
|
|
<p class="description">
|
|
|
|
|
|
|
|
fabric.Canvas
|
|
|
|
|
|
<br /><i>Defined in: </i> <a href="../symbols/src/src_element.class.js.html">element.class.js</a>.
|
|
|
|
</p>
|
|
|
|
<!-- ============================== constructor summary ==================== -->
|
|
|
|
<table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class fabric.Canvas.">
|
|
<caption>Class Summary</caption>
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">Constructor Attributes</th>
|
|
<th scope="col">Constructor Name and Description</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription" >
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#constructor">fabric.Canvas</a></b>(el, options)
|
|
</div>
|
|
<div class="description"></div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
|
|
<!-- ============================== properties summary ===================== -->
|
|
|
|
|
|
|
|
<table class="summaryTable" cellspacing="0" summary="A summary of the fields documented in the class fabric.Canvas.">
|
|
<caption>Field Summary</caption>
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">Field Attributes</th>
|
|
<th scope="col">Field Name and Description</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#backgroundColor">backgroundColor</a></b>
|
|
</div>
|
|
<div class="description">Background color of this canvas instance</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"><constant> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#CANVAS_HEIGHT">CANVAS_HEIGHT</a></b>
|
|
</div>
|
|
<div class="description"></div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"><constant> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#CANVAS_WIDTH">CANVAS_WIDTH</a></b>
|
|
</div>
|
|
<div class="description"></div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"><constant> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#CONTAINER_CLASS">CONTAINER_CLASS</a></b>
|
|
</div>
|
|
<div class="description"></div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"><static> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
fabric.Canvas.<b><a href="../symbols/fabric.Canvas.html#.EMPTY_JSON">EMPTY_JSON</a></b>
|
|
</div>
|
|
<div class="description"></div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#freeDrawingColor">freeDrawingColor</a></b>
|
|
</div>
|
|
<div class="description">Color of the line used in free drawing mode</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#freeDrawingLineWidth">freeDrawingLineWidth</a></b>
|
|
</div>
|
|
<div class="description">Width of a line used in free drawing mode</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#includeDefaultValues">includeDefaultValues</a></b>
|
|
</div>
|
|
<div class="description"></div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#onFpsUpdate">onFpsUpdate</a></b>
|
|
</div>
|
|
<div class="description">Callback; invoked on every redraw of canvas and is being passed a number indicating current fps</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#renderOnAddition">renderOnAddition</a></b>
|
|
</div>
|
|
<div class="description">Indicates whether fabric.Canvas#add should also re-render canvas.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#selection">selection</a></b>
|
|
</div>
|
|
<div class="description">Indicates whether object selection should be enabled</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#selectionBorderColor">selectionBorderColor</a></b>
|
|
</div>
|
|
<div class="description">Color of the border of selection (usually slightly darker than color of selection itself)</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#selectionColor">selectionColor</a></b>
|
|
</div>
|
|
<div class="description">Color of selection</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#selectionLineWidth">selectionLineWidth</a></b>
|
|
</div>
|
|
<div class="description">Width of a line used in selection</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#shouldCacheImages">shouldCacheImages</a></b>
|
|
</div>
|
|
<div class="description">Indicates whether images loaded via `fabric.Canvas#loadImageFromUrl` should be cached</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">
|
|
<b><a href="../symbols/fabric.Canvas.html#stateful">stateful</a></b>
|
|
</div>
|
|
<div class="description">Indicates whether objects' state should be saved</div>
|
|
</td>
|
|
</tr>
|
|
|
|
</tbody>
|
|
</table>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- ============================== methods summary ======================== -->
|
|
|
|
|
|
|
|
<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class fabric.Canvas.">
|
|
<caption>Method Summary</caption>
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">Method Attributes</th>
|
|
<th scope="col">Method Name and Description</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#add">add</a></b>()
|
|
</div>
|
|
<div class="description">Adds objects to canvas, then renders canvas;
|
|
Objects should be instances of (or inherit from) fabric.Object</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#bringForward">bringForward</a></b>(object)
|
|
</div>
|
|
<div class="description">Moves an object one level up in stack of drawn objects</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#bringToFront">bringToFront</a></b>(object)
|
|
</div>
|
|
<div class="description">Moves an object to the top of the stack of drawn objects</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#calcOffset">calcOffset</a></b>()
|
|
</div>
|
|
<div class="description">Calculates canvas element offset relative to the document
|
|
This method is also attached as "resize" event handler of window</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#centerObjectH">centerObjectH</a></b>(object)
|
|
</div>
|
|
<div class="description">Centers object horizontally.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#centerObjectV">centerObjectV</a></b>(object)
|
|
</div>
|
|
<div class="description">Centers object vertically.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#clear">clear</a></b>()
|
|
</div>
|
|
<div class="description">Clears all contexts (background, main, top) of an instance</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#clearContext">clearContext</a></b>(context)
|
|
</div>
|
|
<div class="description">Clears specified context of canvas element</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#clone">clone</a></b>(callback)
|
|
</div>
|
|
<div class="description">Clones canvas instance</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#complexity">complexity</a></b>()
|
|
</div>
|
|
<div class="description">Returns number representation of an instance complexity</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#containsPoint">containsPoint</a></b>(e, target)
|
|
</div>
|
|
<div class="description">Applies one implementation of 'point inside polygon' algorithm</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#deactivateAll">deactivateAll</a></b>()
|
|
</div>
|
|
<div class="description">Deactivates all objects by calling their setActive(false)</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#deactivateAllWithDispatch">deactivateAllWithDispatch</a></b>()
|
|
</div>
|
|
<div class="description">Deactivates all objects and dispatches appropriate events</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#dispose">dispose</a></b>()
|
|
</div>
|
|
<div class="description">Clears a canvas element and removes all event handlers.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#findTarget">findTarget</a></b>(e, skipGroup)
|
|
</div>
|
|
<div class="description">Method that determines what object we are clicking on</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#forEachObject">forEachObject</a></b>(callback, context)
|
|
</div>
|
|
<div class="description">Iterates over all objects, invoking callback for each one of them</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#fxCenterObjectH">fxCenterObjectH</a></b>(object, callbacks)
|
|
</div>
|
|
<div class="description">Centers object horizontally with animation.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#fxCenterObjectV">fxCenterObjectV</a></b>(object, callbacks)
|
|
</div>
|
|
<div class="description">Centers object vertically with animation.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#fxRemove">fxRemove</a></b>(object, callback)
|
|
</div>
|
|
<div class="description">Same as `fabric.Canvas#remove` but animated</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#fxStraightenObject">fxStraightenObject</a></b>(object)
|
|
</div>
|
|
<div class="description">Same as `fabric.Canvas#straightenObject`, but animated</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#getActiveGroup">getActiveGroup</a></b>()
|
|
</div>
|
|
<div class="description">Returns currently active group</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#getActiveObject">getActiveObject</a></b>()
|
|
</div>
|
|
<div class="description">Returns currently active object</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#getCenter">getCenter</a></b>()
|
|
</div>
|
|
<div class="description">Returns coordinates of a center of canvas.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#getContext">getContext</a></b>()
|
|
</div>
|
|
<div class="description">Returns topmost canvas context</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#getElement">getElement</a></b>()
|
|
</div>
|
|
<div class="description">Returns <canvas> element corresponding to this instance</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#getHeight">getHeight</a></b>()
|
|
</div>
|
|
<div class="description">Returns canvas height</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#getObjects">getObjects</a></b>()
|
|
</div>
|
|
<div class="description">Returns an array of objects this instance has</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#getPointer">getPointer</a></b>(e)
|
|
</div>
|
|
<div class="description">Returns pointer coordinates relative to canvas.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#getWidth">getWidth</a></b>()
|
|
</div>
|
|
<div class="description">Returns canvas width</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#insertAt">insertAt</a></b>(object, index)
|
|
</div>
|
|
<div class="description">Inserts an object to canvas at specified index and renders canvas.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#isEmpty">isEmpty</a></b>()
|
|
</div>
|
|
<div class="description">Returns true if canvas contains no objects</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#item">item</a></b>(index)
|
|
</div>
|
|
<div class="description">Returns object at specified index</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#loadFromDatalessJSON">loadFromDatalessJSON</a></b>(json, callback)
|
|
</div>
|
|
<div class="description">Populates canvas with data from the specified dataless JSON
|
|
JSON format must conform to the one of `fabric.Canvas#toDatalessJSON`</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#loadFromJSON">loadFromJSON</a></b>(json, callback)
|
|
</div>
|
|
<div class="description">Populates canvas with data from the specified JSON
|
|
JSON format must conform to the one of `fabric.Canvas#toJSON`</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#loadImageFromURL">loadImageFromURL</a></b>(url, callback)
|
|
</div>
|
|
<div class="description">Loads an image from URL, creates an instance of fabric.Image and passes it to a callback</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#loadSVGFromURL">loadSVGFromURL</a></b>(url, callback)
|
|
</div>
|
|
<div class="description">Takes url corresponding to an SVG document, and parses it to a set of objects</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#onBeforeScaleRotate">onBeforeScaleRotate</a></b>(target)
|
|
</div>
|
|
<div class="description">Callback; invoked right before object is about to be scaled/rotated</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#remove">remove</a></b>(object)
|
|
</div>
|
|
<div class="description">Removes an object from canvas and returns it</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#removeActiveGroup">removeActiveGroup</a></b>()
|
|
</div>
|
|
<div class="description">Removes currently active group</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#removeActiveObject">removeActiveObject</a></b>()
|
|
</div>
|
|
<div class="description">Removes currently active object</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#renderAll">renderAll</a></b>(allOnTop)
|
|
</div>
|
|
<div class="description">Renders both the top canvas and the secondary container canvas.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#renderTop">renderTop</a></b>()
|
|
</div>
|
|
<div class="description">Method to render only the top canvas.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#sendBackwards">sendBackwards</a></b>(object)
|
|
</div>
|
|
<div class="description">Moves an object one level down in stack of drawn objects</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#sendToBack">sendToBack</a></b>(object)
|
|
</div>
|
|
<div class="description">Moves an object to the bottom of the stack of drawn objects</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#setActiveGroup">setActiveGroup</a></b>(group)
|
|
</div>
|
|
<div class="description">Sets active group to a speicified one</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#setActiveObject">setActiveObject</a></b>(object)
|
|
</div>
|
|
<div class="description">Sets given object as active</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#setDimensions">setDimensions</a></b>(dimensions)
|
|
</div>
|
|
<div class="description">Sets dimensions (width, height) of this canvas instance</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#setHeight">setHeight</a></b>(height)
|
|
</div>
|
|
<div class="description">Sets height of this canvas instance</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#setOverlayImage">setOverlayImage</a></b>(url, callback)
|
|
</div>
|
|
<div class="description">Sets overlay image for this canvas</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#setWidth">setWidth</a></b>(width)
|
|
</div>
|
|
<div class="description">Sets width of this canvas instance</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#straightenObject">straightenObject</a></b>(object)
|
|
</div>
|
|
<div class="description">Straightens object, then rerenders canvas</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"><static> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">fabric.Canvas.<b><a href="../symbols/fabric.Canvas.html#.supports">supports</a></b>(methodName)
|
|
</div>
|
|
<div class="description">Provides a way to check support of some of the canvas methods
|
|
(either those of HTMLCanvasElement itself, or rendering context)</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#toDatalessJSON">toDatalessJSON</a></b>()
|
|
</div>
|
|
<div class="description">Returs dataless JSON representation of canvas</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#toDatalessObject">toDatalessObject</a></b>()
|
|
</div>
|
|
<div class="description">Returns dataless object representation of canvas</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#toDataURL">toDataURL</a></b>(format)
|
|
</div>
|
|
<div class="description">Exports canvas element to a dataurl image.</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#toDataURLWithMultiplier">toDataURLWithMultiplier</a></b>(format, multiplier)
|
|
</div>
|
|
<div class="description">Exports canvas element to a dataurl image (allowing to change image size via multiplier).</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"><static> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont">fabric.Canvas.<b><a href="../symbols/fabric.Canvas.html#.toGrayscale">toGrayscale</a></b>(canvasEl)
|
|
</div>
|
|
<div class="description">Takes <canvas> element and transforms its data in such way that it becomes grayscale</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#toJSON">toJSON</a></b>()
|
|
</div>
|
|
<div class="description">Returs JSON representation of canvas</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#toObject">toObject</a></b>()
|
|
</div>
|
|
<div class="description">Returns object representation of canvas</div>
|
|
</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="attributes"> </td>
|
|
<td class="nameDescription">
|
|
<div class="fixedFont"><b><a href="../symbols/fabric.Canvas.html#toString">toString</a></b>()
|
|
</div>
|
|
<div class="description">Returns a string representation of an instance</div>
|
|
</td>
|
|
</tr>
|
|
|
|
</tbody>
|
|
</table>
|
|
|
|
|
|
|
|
|
|
<!-- ============================== events summary ======================== -->
|
|
|
|
|
|
<!-- ============================== constructor details ==================== -->
|
|
|
|
<div class="details"><a name="constructor"> </a>
|
|
<div class="sectionTitle">
|
|
Class Detail
|
|
</div>
|
|
|
|
<div class="fixedFont">
|
|
<b>fabric.Canvas</b>(el, options)
|
|
</div>
|
|
|
|
<div class="description">
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{HTMLElement | String}</span> <b>el</b>
|
|
|
|
</dt>
|
|
<dd><canvas> element to initialize instance on</dd>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Object}</span> <b>options</b>
|
|
<i>Optional</i>
|
|
</dt>
|
|
<dd>Options object</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<!-- ============================== field details ========================== -->
|
|
|
|
<div class="sectionTitle">
|
|
Field Detail
|
|
</div>
|
|
|
|
<a name="backgroundColor"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<b>backgroundColor</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Background color of this canvas instance
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="CANVAS_HEIGHT"> </a>
|
|
<div class="fixedFont"><constant>
|
|
|
|
<span class="light">{Number}</span>
|
|
<b>CANVAS_HEIGHT</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="CANVAS_WIDTH"> </a>
|
|
<div class="fixedFont"><constant>
|
|
|
|
<span class="light">{Number}</span>
|
|
<b>CANVAS_WIDTH</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="CONTAINER_CLASS"> </a>
|
|
<div class="fixedFont"><constant>
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<b>CONTAINER_CLASS</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name=".EMPTY_JSON"> </a>
|
|
<div class="fixedFont"><static>
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<span class="light">fabric.Canvas.</span><b>EMPTY_JSON</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="freeDrawingColor"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<b>freeDrawingColor</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Color of the line used in free drawing mode
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="freeDrawingLineWidth"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Number}</span>
|
|
<b>freeDrawingLineWidth</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Width of a line used in free drawing mode
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="includeDefaultValues"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Boolean}</span>
|
|
<b>includeDefaultValues</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="onFpsUpdate"> </a>
|
|
<div class="fixedFont">
|
|
|
|
|
|
<b>onFpsUpdate</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Callback; invoked on every redraw of canvas and is being passed a number indicating current fps
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="renderOnAddition"> </a>
|
|
<div class="fixedFont">
|
|
|
|
|
|
<b>renderOnAddition</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Indicates whether fabric.Canvas#add should also re-render canvas.
|
|
Disabling this option could give a great performance boost when adding a lot of objects to canvas at once
|
|
(followed by a manual rendering after addition)
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="selection"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Boolean}</span>
|
|
<b>selection</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Indicates whether object selection should be enabled
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="selectionBorderColor"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<b>selectionBorderColor</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Color of the border of selection (usually slightly darker than color of selection itself)
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="selectionColor"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<b>selectionColor</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Color of selection
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="selectionLineWidth"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Number}</span>
|
|
<b>selectionLineWidth</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Width of a line used in selection
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="shouldCacheImages"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Boolean}</span>
|
|
<b>shouldCacheImages</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Indicates whether images loaded via `fabric.Canvas#loadImageFromUrl` should be cached
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="stateful"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Boolean}</span>
|
|
<b>stateful</b>
|
|
|
|
</div>
|
|
<div class="description">
|
|
Indicates whether objects' state should be saved
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- ============================== method details ========================= -->
|
|
|
|
<div class="sectionTitle">
|
|
Method Detail
|
|
</div>
|
|
|
|
<a name="add"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>add</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Adds objects to canvas, then renders canvas;
|
|
Objects should be instances of (or inherit from) fabric.Object
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="bringForward"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>bringForward</b>(object)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Moves an object one level up in stack of drawn objects
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>object</b>
|
|
|
|
</dt>
|
|
<dd>{fabric.Object} Object to send</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="bringToFront"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>bringToFront</b>(object)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Moves an object to the top of the stack of drawn objects
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>object</b>
|
|
|
|
</dt>
|
|
<dd>{fabric.Object} Object to send</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="calcOffset"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>calcOffset</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Calculates canvas element offset relative to the document
|
|
This method is also attached as "resize" event handler of window
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> instance</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="centerObjectH"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>centerObjectH</b>(object)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Centers object horizontally.
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span> <b>object</b>
|
|
|
|
</dt>
|
|
<dd>Object to center</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="centerObjectV"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>centerObjectV</b>(object)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Centers object vertically.
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span> <b>object</b>
|
|
|
|
</dt>
|
|
<dd>Object to center</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="clear"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>clear</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Clears all contexts (background, main, top) of an instance
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="clearContext"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>clearContext</b>(context)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Clears specified context of canvas element
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>context</b>
|
|
|
|
</dt>
|
|
<dd>{Object} ctx context to clear</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="clone"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>clone</b>(callback)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Clones canvas instance
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Object}</span> <b>callback</b>
|
|
<i>Optional</i>
|
|
</dt>
|
|
<dd>Expects `onBeforeClone` and `onAfterClone` functions</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> Clone of this instance</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="complexity"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Number}</span>
|
|
<b>complexity</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns number representation of an instance complexity
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Number}</span> complexity</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="containsPoint"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Boolean}</span>
|
|
<b>containsPoint</b>(e, target)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Applies one implementation of 'point inside polygon' algorithm
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>e</b>
|
|
|
|
</dt>
|
|
<dd>{ Event } event object</dd>
|
|
|
|
<dt>
|
|
<b>target</b>
|
|
|
|
</dt>
|
|
<dd>{ fabric.Object } object to test against</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Boolean}</span> true if point contains within area of given object</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="deactivateAll"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>deactivateAll</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Deactivates all objects by calling their setActive(false)
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="deactivateAllWithDispatch"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>deactivateAllWithDispatch</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Deactivates all objects and dispatches appropriate events
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="dispose"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>dispose</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Clears a canvas element and removes all event handlers.
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="findTarget"> </a>
|
|
<div class="fixedFont">
|
|
|
|
|
|
<b>findTarget</b>(e, skipGroup)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Method that determines what object we are clicking on
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Event}</span> <b>e</b>
|
|
|
|
</dt>
|
|
<dd>mouse event</dd>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Boolean}</span> <b>skipGroup</b>
|
|
|
|
</dt>
|
|
<dd>when true, group is skipped and only objects are traversed through</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="forEachObject"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>forEachObject</b>(callback, context)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Iterates over all objects, invoking callback for each one of them
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>callback</b>
|
|
|
|
</dt>
|
|
<dd></dd>
|
|
|
|
<dt>
|
|
<b>context</b>
|
|
|
|
</dt>
|
|
<dd></dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="fxCenterObjectH"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>fxCenterObjectH</b>(object, callbacks)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Centers object horizontally with animation.
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span> <b>object</b>
|
|
|
|
</dt>
|
|
<dd>Object to center</dd>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Object}</span> <b>callbacks</b>
|
|
<i>Optional</i>
|
|
</dt>
|
|
<dd>Callbacks object with optional "onComplete" and/or "onChange" properties</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="fxCenterObjectV"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>fxCenterObjectV</b>(object, callbacks)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Centers object vertically with animation.
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span> <b>object</b>
|
|
|
|
</dt>
|
|
<dd>Object to center</dd>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Object}</span> <b>callbacks</b>
|
|
<i>Optional</i>
|
|
</dt>
|
|
<dd>Callbacks object with optional "onComplete" and/or "onChange" properties</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="fxRemove"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>fxRemove</b>(object, callback)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Same as `fabric.Canvas#remove` but animated
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span> <b>object</b>
|
|
|
|
</dt>
|
|
<dd>Object to remove</dd>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/Function.html">Function</a>}</span> <b>callback</b>
|
|
|
|
</dt>
|
|
<dd>Callback, invoked on effect completion</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="fxStraightenObject"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>fxStraightenObject</b>(object)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Same as `fabric.Canvas#straightenObject`, but animated
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span> <b>object</b>
|
|
|
|
</dt>
|
|
<dd>Object to straighten</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="getActiveGroup"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Group.html">fabric.Group</a>}</span>
|
|
<b>getActiveGroup</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns currently active group
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Group.html">fabric.Group</a>}</span> Current group</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="getActiveObject"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span>
|
|
<b>getActiveObject</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns currently active object
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span> active object</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="getCenter"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Object}</span>
|
|
<b>getCenter</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns coordinates of a center of canvas.
|
|
Returned value is an object with top and left properties
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Object}</span> object with "top" and "left" number values</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="getContext"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{CanvasRenderingContext2D}</span>
|
|
<b>getContext</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns topmost canvas context
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{CanvasRenderingContext2D}</span> </dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="getElement"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{HTMLCanvasElement}</span>
|
|
<b>getElement</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns <canvas> element corresponding to this instance
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{HTMLCanvasElement}</span> </dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="getHeight"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Number}</span>
|
|
<b>getHeight</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns canvas height
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Number}</span> </dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="getObjects"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/Array.html">Array</a>}</span>
|
|
<b>getObjects</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns an array of objects this instance has
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/Array.html">Array</a>}</span> </dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="getPointer"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Object}</span>
|
|
<b>getPointer</b>(e)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns pointer coordinates relative to canvas.
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>e</b>
|
|
|
|
</dt>
|
|
<dd></dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Object}</span> object with "x" and "y" number values</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="getWidth"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Number}</span>
|
|
<b>getWidth</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns canvas width
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Number}</span> </dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="insertAt"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>insertAt</b>(object, index)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Inserts an object to canvas at specified index and renders canvas.
|
|
An object should be an instance of (or inherit from) fabric.Object
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>object</b>
|
|
|
|
</dt>
|
|
<dd>{Object} Object to insert</dd>
|
|
|
|
<dt>
|
|
<b>index</b>
|
|
|
|
</dt>
|
|
<dd>{Number} index to insert object at</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> instance</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="isEmpty"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Boolean}</span>
|
|
<b>isEmpty</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns true if canvas contains no objects
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Boolean}</span> true if canvas is empty</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="item"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span>
|
|
<b>item</b>(index)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns object at specified index
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Number}</span> <b>index</b>
|
|
|
|
</dt>
|
|
<dd></dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span> </dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="loadFromDatalessJSON"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>loadFromDatalessJSON</b>(json, callback)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Populates canvas with data from the specified dataless JSON
|
|
JSON format must conform to the one of `fabric.Canvas#toDatalessJSON`
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> <b>json</b>
|
|
|
|
</dt>
|
|
<dd>JSON string</dd>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/Function.html">Function</a>}</span> <b>callback</b>
|
|
|
|
</dt>
|
|
<dd>Callback, invoked when json is parsed
|
|
and corresponding objects (e.g: fabric.Image)
|
|
are initialized</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> instance</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="loadFromJSON"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>loadFromJSON</b>(json, callback)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Populates canvas with data from the specified JSON
|
|
JSON format must conform to the one of `fabric.Canvas#toJSON`
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> <b>json</b>
|
|
|
|
</dt>
|
|
<dd>JSON string</dd>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/Function.html">Function</a>}</span> <b>callback</b>
|
|
|
|
</dt>
|
|
<dd>Callback, invoked when json is parsed
|
|
and corresponding objects (e.g: fabric.Image)
|
|
are initialized</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> instance</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="loadImageFromURL"> </a>
|
|
<div class="fixedFont">
|
|
|
|
|
|
<b>loadImageFromURL</b>(url, callback)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Loads an image from URL, creates an instance of fabric.Image and passes it to a callback
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>url</b>
|
|
|
|
</dt>
|
|
<dd>{String} url of image to load</dd>
|
|
|
|
<dt>
|
|
<b>callback</b>
|
|
|
|
</dt>
|
|
<dd>{Function} calback, invoked when image is loaded</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="loadSVGFromURL"> </a>
|
|
<div class="fixedFont">
|
|
|
|
|
|
<b>loadSVGFromURL</b>(url, callback)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Takes url corresponding to an SVG document, and parses it to a set of objects
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> <b>url</b>
|
|
|
|
</dt>
|
|
<dd></dd>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/Function.html">Function</a>}</span> <b>callback</b>
|
|
|
|
</dt>
|
|
<dd></dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="onBeforeScaleRotate"> </a>
|
|
<div class="fixedFont">
|
|
|
|
|
|
<b>onBeforeScaleRotate</b>(target)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Callback; invoked right before object is about to be scaled/rotated
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span> <b>target</b>
|
|
|
|
</dt>
|
|
<dd>Object that's about to be scaled/rotated</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="remove"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Object}</span>
|
|
<b>remove</b>(object)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Removes an object from canvas and returns it
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>object</b>
|
|
|
|
</dt>
|
|
<dd>{Object} Object to remove</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Object}</span> removed object</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="removeActiveGroup"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>removeActiveGroup</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Removes currently active group
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="removeActiveObject"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>removeActiveObject</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Removes currently active object
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="renderAll"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>renderAll</b>(allOnTop)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Renders both the top canvas and the secondary container canvas.
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>allOnTop</b>
|
|
|
|
</dt>
|
|
<dd>{Boolean} optional Whether we want to force all images to be rendered on the top canvas</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> instance</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="renderTop"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>renderTop</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Method to render only the top canvas.
|
|
Also used to render the group selection box.
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="sendBackwards"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>sendBackwards</b>(object)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Moves an object one level down in stack of drawn objects
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>object</b>
|
|
|
|
</dt>
|
|
<dd>{fabric.Object} Object to send</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="sendToBack"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>sendToBack</b>(object)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Moves an object to the bottom of the stack of drawn objects
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>object</b>
|
|
|
|
</dt>
|
|
<dd>{fabric.Object} Object to send to back</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="setActiveGroup"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>setActiveGroup</b>(group)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Sets active group to a speicified one
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/fabric.Group.html">fabric.Group</a>}</span> <b>group</b>
|
|
|
|
</dt>
|
|
<dd>Group to set as a current one</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="setActiveObject"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>setActiveObject</b>(object)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Sets given object as active
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>object</b>
|
|
|
|
</dt>
|
|
<dd>{fabric.Object} Object to set as an active one</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="setDimensions"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>setDimensions</b>(dimensions)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Sets dimensions (width, height) of this canvas instance
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Object}</span> <b>dimensions</b>
|
|
|
|
</dt>
|
|
<dd></dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="setHeight"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>setHeight</b>(height)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Sets height of this canvas instance
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Number}</span> <b>height</b>
|
|
|
|
</dt>
|
|
<dd>value to set height to</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> instance</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="setOverlayImage"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>setOverlayImage</b>(url, callback)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Sets overlay image for this canvas
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> <b>url</b>
|
|
|
|
</dt>
|
|
<dd>url of an image to set background to</dd>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/Function.html">Function</a>}</span> <b>callback</b>
|
|
|
|
</dt>
|
|
<dd>callback to invoke when image is loaded and set as an overlay one</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="setWidth"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>setWidth</b>(width)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Sets width of this canvas instance
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Number}</span> <b>width</b>
|
|
|
|
</dt>
|
|
<dd>value to set width to</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> instance</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="straightenObject"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span>
|
|
<b>straightenObject</b>(object)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Straightens object, then rerenders canvas
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/fabric.Object.html">fabric.Object</a>}</span> <b>object</b>
|
|
|
|
</dt>
|
|
<dd>Object to straighten</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/fabric.Canvas.html">fabric.Canvas</a>}</span> thisArg</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name=".supports"> </a>
|
|
<div class="fixedFont"><static>
|
|
|
|
<span class="light">{Boolean | null}</span>
|
|
<span class="light">fabric.Canvas.</span><b>supports</b>(methodName)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Provides a way to check support of some of the canvas methods
|
|
(either those of HTMLCanvasElement itself, or rendering context)
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<b>methodName</b>
|
|
|
|
</dt>
|
|
<dd>{String} Method to check support for;
|
|
Could be one of "getImageData" or "toDataURL"</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Boolean | null}</span> `true` if method is supported (or at least exists),
|
|
`null` if canvas element or context can not be initialized</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="toDatalessJSON"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<b>toDatalessJSON</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returs dataless JSON representation of canvas
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> json string</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="toDatalessObject"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Object}</span>
|
|
<b>toDatalessObject</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns dataless object representation of canvas
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Object}</span> </dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="toDataURL"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<b>toDataURL</b>(format)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Exports canvas element to a dataurl image.
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> <b>format</b>
|
|
|
|
</dt>
|
|
<dd>the format of the output image. Either "jpeg" or "png".</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> </dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="toDataURLWithMultiplier"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<b>toDataURLWithMultiplier</b>(format, multiplier)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Exports canvas element to a dataurl image (allowing to change image size via multiplier).
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> <b>format</b>
|
|
|
|
</dt>
|
|
<dd>(png|jpeg)</dd>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{Number}</span> <b>multiplier</b>
|
|
|
|
</dt>
|
|
<dd></dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> </dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name=".toGrayscale"> </a>
|
|
<div class="fixedFont"><static>
|
|
|
|
|
|
<span class="light">fabric.Canvas.</span><b>toGrayscale</b>(canvasEl)
|
|
|
|
</div>
|
|
<div class="description">
|
|
Takes <canvas> element and transforms its data in such way that it becomes grayscale
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Parameters:</dt>
|
|
|
|
<dt>
|
|
<span class="light fixedFont">{HTMLCanvasElement}</span> <b>canvasEl</b>
|
|
|
|
</dt>
|
|
<dd></dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="toJSON"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<b>toJSON</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returs JSON representation of canvas
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> json string</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="toObject"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{Object}</span>
|
|
<b>toObject</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns object representation of canvas
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{Object}</span> </dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
<a name="toString"> </a>
|
|
<div class="fixedFont">
|
|
|
|
<span class="light">{<a href="../symbols/String.html">String</a>}</span>
|
|
<b>toString</b>()
|
|
|
|
</div>
|
|
<div class="description">
|
|
Returns a string representation of an instance
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="detailList">
|
|
<dt class="heading">Returns:</dt>
|
|
|
|
<dd><span class="light fixedFont">{<a href="../symbols/String.html">String</a>}</span> string representation of an instance</dd>
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- ============================== event details ========================= -->
|
|
|
|
|
|
<hr />
|
|
</div>
|
|
|
|
|
|
<!-- ============================== footer ================================= -->
|
|
<div class="fineprint" style="clear:both">
|
|
|
|
Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.4.0 on Tue Jun 28 2011 18:47:43 GMT-0400 (EDT)
|
|
</div>
|
|
</body>
|
|
</html>
|