Helix SwarmHelix Swarm

WireIt.CanvasElement.html

  • //
  • guest/
  • christiane_renck/
  • mergequestjs/
  • main/
  • demos/
  • WireIt/
  • api/
  • WireIt.CanvasElement.html #1
  • View
  • Commits
  • Open Download .zip Download (26 KB) 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html xmlns:yui="http://yuilibrary.com/rdf/1.0/yui.rdf#">
  3. <head>
  4.     <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  5. 	<title>API: WireIt  WireIt.CanvasElement   (YUI Library)</title>
  6.  
  7. 	<link rel="stylesheet" type="text/css" href="assets/reset-fonts-grids-min.css" />
  8. 	<link rel="stylesheet" type="text/css" href="assets/api.css" />
  9.  
  10.     <script type="text/javascript" src="assets/api-js"></script>
  11.     <script type="text/javascript" src="assets/ac-js"></script>
  12. </head>
  13.  
  14. <body id="yahoo-com">
  15.  
  16. <div id="doc3" class="yui-t2">
  17. 	<div id="hd">
  18.         <h1><a href="http://neyric.github.com/wireit" title="WireItLibrary">WireItLibrary</a></h1>
  19.         <h3>WireIt&nbsp; <span class="subtitle">0.6.0</span></h3>
  20.         <a href="./index.html" title="WireItLibrary">WireItLibrary</a> 
  21.             &gt; <a href="./module_wireit.html" title="WireIt">WireIt</a>
  22.                  &gt; WireIt.CanvasElement 
  23.                 
  24.         <form onsubmit="return false">
  25.             <div id="propertysearch">
  26.                 Search: <input autocomplete="off" id="searchinput" />
  27.                 <div id="searchresults">
  28.                     &nbsp;
  29.                 </div>
  30.             </div>
  31.         </form>
  32. 	</div>
  33.  
  34. 	<div id="bd">
  35. 		<div id="yui-main">
  36. 			<div class="yui-b">
  37.             <form action="#" name="yui-classopts-form" method="get" id="yui-classopts-form">
  38.                 <fieldset>
  39.                     <legend>Filters</legend>
  40.                 <span class="classopts"><input type="checkbox" name="show_private" id="show_private" /> <label for="show_private">Show Private</label></span>
  41.                 <span class="classopts"><input type="checkbox" name="show_protected" id="show_protected" /> <label for="show_protected">Show Protected</label></span>
  42.                 <span class="classopts"><input type="checkbox" name="show_deprecated" id="show_deprecated" /> <label for="show_deprecated">Show Deprecated</label></span>
  43.                 </fieldset>
  44.             </form>
  45.  
  46.                     <h2>
  47.                         
  48.  
  49.                         
  50.                         
  51.                             Class <b property="yui:name">WireIt.CanvasElement</b>
  52.                         <span class="extends">
  53.                         </span>
  54.  
  55.                     </h2>
  56.                     <!-- class tree goes here -->
  57.                     
  58.                         <dl class="subclasses" rel="yui:subclasses">
  59.                             <dt>Known Subclasses:</dt>
  60.                             <dd>
  61.                                     <span rel="yui:subclass" resource="WireIt.Wire.html">
  62.                                     <a href="WireIt.Wire.html" property="yui:name" title="WireIt.Wire">WireIt.Wire</a>
  63.                                     </span>
  64.                                     <span rel="yui:subclass" resource="WireIt.RubberBand.html">
  65.                                     <a href="WireIt.RubberBand.html" property="yui:name" title="WireIt.RubberBand">WireIt.RubberBand</a>
  66.                                     </span>
  67.                                     <span rel="yui:subclass" resource="WireIt.LayerMap.html">
  68.                                     <a href="WireIt.LayerMap.html" property="yui:name" title="WireIt.LayerMap">WireIt.LayerMap</a>
  69.                                     </span>
  70.                             </dd>
  71.                        </dl>
  72.                 
  73.   
  74.  
  75.                     <div class="summary description" property="yui:description">
  76.                         Create a canvas element and wrap cross-browser hacks to resize it
  77.                     </div>
  78.  
  79.                         <div class="section constructor details" rel="yui:constructor" resource="#constructor">
  80.                         <h3 id="constructor">Constructor</h3>
  81.                         <div class="content">
  82.                             <div class="detail">
  83.                                 <strong property="yui:name">WireIt.CanvasElement</strong>
  84.                                 <code>
  85.                                     (
  86.   
  87.                                         
  88.                                                 
  89.                                                 parentNode
  90.                                     )
  91.                                 </code>
  92.                                 <div class="description">
  93.                                         <dl rel="yui:parameters">
  94.                                             <dt>Parameters:</dt>
  95.                                                 <dd rel="yui:parameter">
  96.                                                     <code><span property="yui:name">parentNode</span>
  97.                                                     &lt;<span property="yui:type">HTMLElement</span>&gt;
  98.                                                     </code>
  99.                                                     <span property="yui:description"> The canvas tag will be append to this parent DOM node.</span>
  100.                                                 </dd>
  101.                                         </dl>
  102.                                     
  103.                                     
  104.                                 </div>
  105.                             </div>
  106.                         </div>
  107.                     </div>
  108.                     
  109.                     <div rel="yui:properties" resource="#properties">
  110.                         <div class="section field details">
  111.                             <h3 id="properties">Properties</h3>
  112.                             <div class="content">
  113.                                     <div class="" rel="yui:property" resource="#property_element">
  114.                                     <h4><a name="property_element" property="yui:name">element</a>
  115.                                         - <code><span property="yui:type">HTMLElement</span></code>
  116.                                     </h4>
  117.                                     <div class="detail">
  118.                                         <div class="description" property="yui:description">
  119.                                             The canvas element
  120.                                         </div>
  121.                                     </div>
  122.      
  123.                                         
  124.  
  125.  
  126.                                     <hr />
  127.                                     </div>
  128.                             </div>
  129.                         </div>
  130.  
  131.                     </div>
  132.  
  133.                     <div rel="yui:methods" resource="#methods">
  134.                         <div class="section method details">
  135.                             <h3 id="methods">Methods</h3>
  136.                             <div class="content">
  137.                                     <div class="" rel="yui:method" resource="#method_destroy">
  138.                                     <h4>
  139.                                         <a name="method_destroy">destroy</a></h4>
  140.                                     <div class="detail" >
  141.                                         <code>
  142.                                         
  143.                                         
  144.                                         
  145.                                         void
  146.                                             <strong property="yui:name">destroy</strong>
  147.                                            (
  148.                                             )
  149.                                         </code>
  150.                                         
  151.                                         <div class="description" property="yui:description">
  152.                                             Purge all event listeners and remove the component from the dom
  153.                                         </div>
  154.  
  155.                                         <div class="description">
  156.  
  157.  
  158.  
  159.  
  160.              
  161.  
  162.                                         </div>
  163.  
  164.                                     </div>
  165.                                     <hr />
  166.                                     </div>
  167.                                     <div class="" rel="yui:method" resource="#method_getContext">
  168.                                     <h4>
  169.                                         <a name="method_getContext">getContext</a></h4>
  170.                                     <div class="detail" >
  171.                                         <code>
  172.                                         
  173.                                         
  174.                                         
  175.                                         CanvasContext
  176.                                             <strong property="yui:name">getContext</strong>
  177.                                            (
  178.                                                 
  179.                                                         
  180.                                                          [mode]
  181.                                                     
  182.                                                 
  183.                                             )
  184.                                         </code>
  185.                                         
  186.                                         <div class="description" property="yui:description">
  187.                                             Get a drawing context
  188.                                         </div>
  189.  
  190.                                         <div class="description">
  191.  
  192.                                                 <dl rel="yui:parameters">
  193.                                                     <dt>Parameters:</dt>
  194.                                                         <dd rel="yui:parameter">
  195.                                                         <code><span property="yui:name">[mode]</span>
  196.                                                         &lt;<span property="yui:type">String</span>&gt;
  197.                                                         </code>
  198.                                                         <span property="yui:description"> Context mode (default "2d")</span>
  199.                                                         </dd>
  200.                                                 </dl>
  201.  
  202.                                                 <dl>
  203.                                                     <dt>Returns:
  204.                                                     <code property="yui:return">
  205.                                                             CanvasContext
  206.                                                     </code></dt>
  207.                                                     <dd property="yui:returnInfo">the context</dd>
  208.                                                 </dl>
  209.  
  210.  
  211.              
  212.  
  213.                                         </div>
  214.  
  215.                                     </div>
  216.                                     <hr />
  217.                                     </div>
  218.                                     <div class="" rel="yui:method" resource="#method_SetCanvasRegion">
  219.                                     <h4>
  220.                                         <a name="method_SetCanvasRegion">SetCanvasRegion</a></h4>
  221.                                     <div class="detail" >
  222.                                         <code>
  223.                                         
  224.                                         
  225.                                         
  226.                                         void
  227.                                             <strong property="yui:name">SetCanvasRegion</strong>
  228.                                            (
  229.                                                 
  230.                                                         
  231.                                                          left
  232.                                                     
  233.                                                 
  234.                                                         , 
  235.                                                          top
  236.                                                     
  237.                                                 
  238.                                                         , 
  239.                                                          width
  240.                                                     
  241.                                                 
  242.                                                         , 
  243.                                                          height
  244.                                                     
  245.                                                 
  246.                                             )
  247.                                         </code>
  248.                                         
  249.                                         <div class="description" property="yui:description">
  250.                                             Set the canvas position and size.
  251. <b>Warning:</b> This method changes the <i>element</i> property under some brother. Don't copy references !
  252.                                         </div>
  253.  
  254.                                         <div class="description">
  255.  
  256.                                                 <dl rel="yui:parameters">
  257.                                                     <dt>Parameters:</dt>
  258.                                                         <dd rel="yui:parameter">
  259.                                                         <code><span property="yui:name">left</span>
  260.                                                         &lt;<span property="yui:type">Number</span>&gt;
  261.                                                         </code>
  262.                                                         <span property="yui:description"> Left position</span>
  263.                                                         </dd>
  264.                                                         <dd rel="yui:parameter">
  265.                                                         <code><span property="yui:name">top</span>
  266.                                                         &lt;<span property="yui:type">Number</span>&gt;
  267.                                                         </code>
  268.                                                         <span property="yui:description"> Top position</span>
  269.                                                         </dd>
  270.                                                         <dd rel="yui:parameter">
  271.                                                         <code><span property="yui:name">width</span>
  272.                                                         &lt;<span property="yui:type">Number</span>&gt;
  273.                                                         </code>
  274.                                                         <span property="yui:description"> New width</span>
  275.                                                         </dd>
  276.                                                         <dd rel="yui:parameter">
  277.                                                         <code><span property="yui:name">height</span>
  278.                                                         &lt;<span property="yui:type">Number</span>&gt;
  279.                                                         </code>
  280.                                                         <span property="yui:description"> New height</span>
  281.                                                         </dd>
  282.                                                 </dl>
  283.  
  284.  
  285.  
  286.              
  287.  
  288.                                         </div>
  289.  
  290.                                     </div>
  291.                                     <hr />
  292.                                     </div>
  293.                             </div>
  294.                         </div>
  295.  
  296.                     </div>
  297.  
  298.                     <div rel="yui:events" resource="#events">
  299.  
  300.  
  301.                     </div>
  302.  
  303.                     <div rel="yui:attributes" resource="#configattributes">
  304.  
  305.                     </div>
  306.  
  307. 			</div>
  308. 		</div>
  309. 		<div class="yui-b">
  310.             <div class="nav">
  311.  
  312.                     <div id="moduleList" class="module">
  313.                         <h4>Modules</h4>
  314.                         <ul class="content">
  315.                                 <li class=""><a href="module_animations-plugin.html" title="animations-plugin">animations-plugin</a></li>
  316.                                 <li class=""><a href="module_composable-plugin.html" title="composable-plugin">composable-plugin</a></li>
  317.                                 <li class=""><a href="module_editor-plugin.html" title="editor-plugin">editor-plugin</a></li>
  318.                                 <li class=""><a href="module_inputex-plugin.html" title="inputex-plugin">inputex-plugin</a></li>
  319.                                 <li class=""><a href="module_layout-plugin.html" title="layout-plugin">layout-plugin</a></li>
  320.                                 <li class="selected"><a href="module_wireit.html" title="WireIt">WireIt</a></li>
  321.                         </ul>
  322.                     </div>
  323.  
  324.                     <div id="classList" class="module">
  325.                         <h4>Classes</h4>
  326.                         <ul class="content">
  327.                                 <li class=""><a href="WireIt.ArrowWire.html" title="WireIt.ArrowWire">WireIt.ArrowWire</a></li>
  328.                                 <li class=""><a href="WireIt.BezierArrowWire.html" title="WireIt.BezierArrowWire">WireIt.BezierArrowWire</a></li>
  329.                                 <li class=""><a href="WireIt.BezierWire.html" title="WireIt.BezierWire">WireIt.BezierWire</a></li>
  330.                                 <li class=""><a href="WireIt.CanvasContainer.html" title="WireIt.CanvasContainer">WireIt.CanvasContainer</a></li>
  331.                                 <li class="selected"><a href="WireIt.CanvasElement.html" title="WireIt.CanvasElement">WireIt.CanvasElement</a></li>
  332.                                 <li class=""><a href="WireIt.Container.html" title="WireIt.Container">WireIt.Container</a></li>
  333.                                 <li class=""><a href="WireIt.Layer.html" title="WireIt.Layer">WireIt.Layer</a></li>
  334.                                 <li class=""><a href="WireIt.LayerMap.html" title="WireIt.LayerMap">WireIt.LayerMap</a></li>
  335.                                 <li class=""><a href="WireIt.LeftSquareArrow.html" title="WireIt.LeftSquareArrow">WireIt.LeftSquareArrow</a></li>
  336.                                 <li class=""><a href="WireIt.RectLabelContainer.html" title="WireIt.RectLabelContainer">WireIt.RectLabelContainer</a></li>
  337.                                 <li class=""><a href="WireIt.RightSquareArrow.html" title="WireIt.RightSquareArrow">WireIt.RightSquareArrow</a></li>
  338.                                 <li class=""><a href="WireIt.Scissors.html" title="WireIt.Scissors">WireIt.Scissors</a></li>
  339.                                 <li class=""><a href="WireIt.StepWire.html" title="WireIt.StepWire">WireIt.StepWire</a></li>
  340.                                 <li class=""><a href="WireIt.Terminal.html" title="WireIt.Terminal">WireIt.Terminal</a></li>
  341.                                 <li class=""><a href="WireIt.TerminalProxy.html" title="WireIt.TerminalProxy">WireIt.TerminalProxy</a></li>
  342.                                 <li class=""><a href="WireIt.util.DD.html" title="WireIt.util.DD">WireIt.util.DD</a></li>
  343.                                 <li class=""><a href="WireIt.util.DDResize.html" title="WireIt.util.DDResize">WireIt.util.DDResize</a></li>
  344.                                 <li class=""><a href="WireIt.util.EllipseLabelContainer.html" title="WireIt.util.EllipseLabelContainer">WireIt.util.EllipseLabelContainer</a></li>
  345.                                 <li class=""><a href="WireIt.util.ImageContainer.html" title="WireIt.util.ImageContainer">WireIt.util.ImageContainer</a></li>
  346.                                 <li class=""><a href="WireIt.util.InOutContainer.html" title="WireIt.util.InOutContainer">WireIt.util.InOutContainer</a></li>
  347.                                 <li class=""><a href="WireIt.util.TerminalInput.html" title="WireIt.util.TerminalInput">WireIt.util.TerminalInput</a></li>
  348.                                 <li class=""><a href="WireIt.util.TerminalOutput.html" title="WireIt.util.TerminalOutput">WireIt.util.TerminalOutput</a></li>
  349.                                 <li class=""><a href="WireIt.Wire.html" title="WireIt.Wire">WireIt.Wire</a></li>
  350.                                 <li class=""><a href="WireIt.WireIt.html" title="WireIt.WireIt">WireIt.WireIt</a></li>
  351.                         </ul>
  352.                     </div>
  353.  
  354.                     <div id="fileList" class="module">
  355.                         <h4>Files</h4>
  356.                         <ul class="content">        
  357.                                 <li class=""><a href="ArrowWire.js.html" title="ArrowWire.js">ArrowWire.js</a></li>
  358.                                 <li class=""><a href="BezierArrowWire.js.html" title="BezierArrowWire.js">BezierArrowWire.js</a></li>
  359.                                 <li class=""><a href="BezierWire.js.html" title="BezierWire.js">BezierWire.js</a></li>
  360.                                 <li class=""><a href="CanvasContainer.js.html" title="CanvasContainer.js">CanvasContainer.js</a></li>
  361.                                 <li class=""><a href="CanvasElement.js.html" title="CanvasElement.js">CanvasElement.js</a></li>
  362.                                 <li class=""><a href="Container.js.html" title="Container.js">Container.js</a></li>
  363.                                 <li class=""><a href="DD.js.html" title="DD.js">DD.js</a></li>
  364.                                 <li class=""><a href="DDResize.js.html" title="DDResize.js">DDResize.js</a></li>
  365.                                 <li class=""><a href="EllipseLabelContainer.js.html" title="EllipseLabelContainer.js">EllipseLabelContainer.js</a></li>
  366.                                 <li class=""><a href="ImageContainer.js.html" title="ImageContainer.js">ImageContainer.js</a></li>
  367.                                 <li class=""><a href="InOutContainer.js.html" title="InOutContainer.js">InOutContainer.js</a></li>
  368.                                 <li class=""><a href="Layer.js.html" title="Layer.js">Layer.js</a></li>
  369.                                 <li class=""><a href="LayerMap.js.html" title="LayerMap.js">LayerMap.js</a></li>
  370.                                 <li class=""><a href="LeftSquareArrowWire.js.html" title="LeftSquareArrowWire.js">LeftSquareArrowWire.js</a></li>
  371.                                 <li class=""><a href="RectLabelContainer.js.html" title="RectLabelContainer.js">RectLabelContainer.js</a></li>
  372.                                 <li class=""><a href="RightSquareArrowWire.js.html" title="RightSquareArrowWire.js">RightSquareArrowWire.js</a></li>
  373.                                 <li class=""><a href="Scissors.js.html" title="Scissors.js">Scissors.js</a></li>
  374.                                 <li class=""><a href="StepWire.js.html" title="StepWire.js">StepWire.js</a></li>
  375.                                 <li class=""><a href="Terminal.js.html" title="Terminal.js">Terminal.js</a></li>
  376.                                 <li class=""><a href="TerminalInput.js.html" title="TerminalInput.js">TerminalInput.js</a></li>
  377.                                 <li class=""><a href="TerminalOutput.js.html" title="TerminalOutput.js">TerminalOutput.js</a></li>
  378.                                 <li class=""><a href="TerminalProxy.js.html" title="TerminalProxy.js">TerminalProxy.js</a></li>
  379.                                 <li class=""><a href="Wire.js.html" title="Wire.js">Wire.js</a></li>
  380.                                 <li class=""><a href="WireIt.js.html" title="WireIt.js">WireIt.js</a></li>
  381.                         </ul>
  382.                     </div>
  383.  
  384.                     <div id="propertyList" class="module">
  385.                         <h4>Properties</h4>
  386.                         <ul class="content">        
  387.                                 <li class=""><a href="#property_element" title="element">element</a></li>
  388.                         </ul>
  389.                     </div>
  390.  
  391.                     <div id="methodsList" class="module">
  392.                         <h4>Methods</h4>
  393.                         <ul class="content">        
  394.                                 <li class=""><a href="#method_destroy" title="destroy">destroy</a></li>
  395.                                 <li class=""><a href="#method_getContext" title="getContext">getContext</a></li>
  396.                                 <li class=""><a href="#method_SetCanvasRegion" title="SetCanvasRegion">SetCanvasRegion</a></li>
  397.                         </ul>
  398.                     </div>
  399.  
  400.  
  401.  
  402.             </div>
  403. 		</div>
  404. 	</div>
  405. 	<div id="ft">
  406.         <hr />
  407.         Copyright &copy; 2010 Eric Abouaf All rights reserved.
  408. 	</div>
  409. </div>
  410. <script type="text/javascript">
  411.  
  412.     var ALL_YUI_PROPS = [{"url": "WireIt.CanvasContainer.html#property_className", "access": "", "host": "WireIt.CanvasContainer", "type": "property", "name": "className"}, {"url": "WireIt.BezierWire.html#property_coeffMulDirection", "access": "", "host": "WireIt.BezierWire", "type": "property", "name": "coeffMulDirection"}, {"url": "WireIt.CanvasContainer.html#property_ddHandle", "access": "", "host": "WireIt.CanvasContainer", "type": "property", "name": "ddHandle"}, {"url": "WireIt.CanvasElement.html#method_destroy", "access": "", "host": "WireIt.CanvasElement", "type": "method", "name": "destroy"}, {"url": "WireIt.ArrowWire.html#method_draw", "access": "", "host": "WireIt.ArrowWire", "type": "method", "name": "draw"}, {"url": "WireIt.BezierArrowWire.html#method_draw", "access": "", "host": "WireIt.BezierArrowWire", "type": "method", "name": "draw"}, {"url": "WireIt.BezierWire.html#method_draw", "access": "", "host": "WireIt.BezierWire", "type": "method", "name": "draw"}, {"url": "WireIt.CanvasContainer.html#method_drawCanvas", "access": "", "host": "WireIt.CanvasContainer", "type": "method", "name": "drawCanvas"}, {"url": "WireIt.CanvasElement.html#property_element", "access": "", "host": "WireIt.CanvasElement", "type": "property", "name": "element"}, {"url": "WireIt.CanvasElement.html#method_getContext", "access": "", "host": "WireIt.CanvasElement", "type": "method", "name": "getContext"}, {"url": "WireIt.CanvasContainer.html#property_height", "access": "", "host": "WireIt.CanvasContainer", "type": "property", "name": "height"}, {"url": "WireIt.CanvasContainer.html#method_onResize", "access": "", "host": "WireIt.CanvasContainer", "type": "method", "name": "onResize"}, {"url": "WireIt.CanvasContainer.html#method_render", "access": "", "host": "WireIt.CanvasContainer", "type": "method", "name": "render"}, {"url": "WireIt.CanvasElement.html#method_SetCanvasRegion", "access": "", "host": "WireIt.CanvasElement", "type": "method", "name": "SetCanvasRegion"}, {"url": "WireIt.CanvasContainer.html#property_width", "access": "", "host": "WireIt.CanvasContainer", "type": "property", "name": "width"}, {"url": "WireIt.ArrowWire.html#property_xtype", "access": "", "host": "WireIt.ArrowWire", "type": "property", "name": "xtype"}, {"url": "WireIt.BezierArrowWire.html#property_xtype", "access": "", "host": "WireIt.BezierArrowWire", "type": "property", "name": "xtype"}, {"url": "WireIt.BezierWire.html#property_xtype", "access": "", "host": "WireIt.BezierWire", "type": "property", "name": "xtype"}, {"url": "WireIt.CanvasContainer.html#property_xtype", "access": "", "host": "WireIt.CanvasContainer", "type": "property", "name": "xtype"}];
  413. </script>
  414. </body>
  415. </html>
# Change User Description Committed
#1 16445 christiane_renck Rename/move file(s) 9 years ago
//guest/christiane_renck/MergeQuestJS/main/demos/WireIt/api/WireIt.CanvasElement.html
#1 16444 christiane_renck Adding MergeQuestJS to the Workshop. 9 years ago