Image.html 47 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474247524762477247824792480248124822483248424852486248724882489249024912492249324942495249624972498249925002501250225032504250525062507250825092510251125122513251425152516251725182519252025212522252325242525252625272528252925302531253225332534253525362537253825392540254125422543254425452546254725482549255025512552255325542555255625572558255925602561256225632564256525662567256825692570257125722573257425752576257725782579258025812582258325842585258625872588258925902591259225932594259525962597259825992600260126022603260426052606260726082609261026112612261326142615261626172618261926202621262226232624262526262627262826292630263126322633263426352636263726382639264026412642264326442645264626472648264926502651265226532654265526562657265826592660266126622663266426652666266726682669267026712672267326742675267626772678267926802681268226832684268526862687268826892690269126922693269426952696269726982699270027012702270327042705270627072708270927102711271227132714271527162717271827192720272127222723272427252726272727282729273027312732273327342735273627372738273927402741274227432744274527462747274827492750275127522753275427552756275727582759276027612762276327642765276627672768276927702771277227732774277527762777277827792780278127822783278427852786278727882789279027912792279327942795279627972798279928002801280228032804280528062807280828092810281128122813281428152816281728182819282028212822282328242825282628272828282928302831283228332834283528362837283828392840284128422843284428452846284728482849285028512852285328542855285628572858285928602861286228632864286528662867286828692870287128722873287428752876287728782879288028812882288328842885288628872888288928902891289228932894289528962897289828992900290129022903290429052906290729082909291029112912291329142915291629172918291929202921292229232924292529262927292829292930293129322933293429352936293729382939294029412942294329442945294629472948294929502951295229532954295529562957295829592960296129622963296429652966296729682969297029712972297329742975297629772978297929802981298229832984298529862987298829892990299129922993299429952996299729982999300030013002300330043005300630073008300930103011301230133014301530163017301830193020302130223023302430253026302730283029303030313032303330343035303630373038303930403041304230433044304530463047304830493050305130523053305430553056305730583059306030613062306330643065306630673068306930703071307230733074307530763077307830793080308130823083308430853086308730883089309030913092309330943095309630973098309931003101310231033104310531063107310831093110311131123113311431153116311731183119312031213122312331243125312631273128312931303131313231333134313531363137313831393140314131423143314431453146314731483149315031513152315331543155315631573158315931603161316231633164316531663167316831693170317131723173317431753176317731783179318031813182318331843185318631873188318931903191319231933194319531963197319831993200320132023203320432053206320732083209321032113212321332143215321632173218321932203221322232233224322532263227322832293230323132323233323432353236323732383239324032413242324332443245324632473248324932503251325232533254325532563257325832593260326132623263326432653266326732683269327032713272327332743275327632773278327932803281328232833284328532863287328832893290329132923293329432953296329732983299330033013302330333043305330633073308330933103311331233133314331533163317331833193320332133223323332433253326332733283329333033313332333333343335333633373338333933403341334233433344334533463347334833493350335133523353335433553356335733583359336033613362336333643365336633673368336933703371337233733374337533763377337833793380338133823383338433853386338733883389339033913392339333943395339633973398339934003401340234033404340534063407340834093410341134123413341434153416341734183419342034213422342334243425342634273428342934303431343234333434343534363437343834393440344134423443344434453446344734483449345034513452345334543455345634573458345934603461346234633464346534663467346834693470347134723473347434753476347734783479348034813482348334843485348634873488348934903491349234933494349534963497349834993500350135023503350435053506350735083509351035113512351335143515351635173518351935203521352235233524352535263527352835293530353135323533353435353536353735383539354035413542354335443545354635473548354935503551355235533554355535563557355835593560356135623563356435653566356735683569357035713572357335743575357635773578357935803581358235833584358535863587358835893590359135923593359435953596359735983599360036013602360336043605360636073608360936103611361236133614361536163617361836193620362136223623362436253626362736283629363036313632363336343635363636373638363936403641364236433644364536463647364836493650365136523653365436553656365736583659366036613662366336643665366636673668366936703671367236733674367536763677367836793680368136823683368436853686368736883689369036913692369336943695369636973698369937003701370237033704370537063707370837093710371137123713371437153716371737183719372037213722372337243725372637273728372937303731373237333734373537363737373837393740374137423743374437453746374737483749375037513752375337543755375637573758375937603761376237633764376537663767376837693770377137723773377437753776377737783779378037813782378337843785378637873788378937903791379237933794379537963797379837993800380138023803380438053806380738083809381038113812381338143815381638173818381938203821382238233824382538263827382838293830383138323833383438353836383738383839384038413842384338443845384638473848384938503851385238533854385538563857385838593860386138623863386438653866386738683869387038713872387338743875387638773878387938803881388238833884388538863887388838893890389138923893389438953896389738983899390039013902390339043905390639073908390939103911391239133914391539163917391839193920392139223923392439253926392739283929393039313932393339343935393639373938393939403941394239433944394539463947394839493950395139523953395439553956395739583959396039613962396339643965396639673968396939703971397239733974397539763977397839793980398139823983398439853986398739883989399039913992399339943995399639973998399940004001400240034004400540064007400840094010401140124013401440154016401740184019402040214022402340244025402640274028402940304031403240334034403540364037403840394040404140424043
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>JSDoc: Class: Image</title>
  6. <script src="scripts/prettify/prettify.js"> </script>
  7. <script src="scripts/prettify/lang-css.js"> </script>
  8. <!--[if lt IE 9]>
  9. <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  10. <![endif]-->
  11. <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
  12. <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
  13. </head>
  14. <body>
  15. <div id="main">
  16. <h1 class="page-title">Class: Image</h1>
  17. <section>
  18. <header>
  19. <h2><span class="attribs"><span class="type-signature"></span></span>Image<span class="signature">(src<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h2>
  20. </header>
  21. <article>
  22. <div class="container-overview">
  23. <h4 class="name" id="Image"><span class="type-signature"></span>new Image<span class="signature">(src<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
  24. <div class="description">
  25. Image object is used to draw an image from URL.
  26. </div>
  27. <h5>Parameters:</h5>
  28. <table class="params">
  29. <thead>
  30. <tr>
  31. <th>Name</th>
  32. <th>Type</th>
  33. <th>Attributes</th>
  34. <th class="last">Description</th>
  35. </tr>
  36. </thead>
  37. <tbody>
  38. <tr>
  39. <td class="name"><code>src</code></td>
  40. <td class="type">
  41. <span class="param-type">string</span>
  42. </td>
  43. <td class="attributes">
  44. &lt;optional><br>
  45. </td>
  46. <td class="description last">Source URL of the image.</td>
  47. </tr>
  48. </tbody>
  49. </table>
  50. <dl class="details">
  51. <dt class="tag-source">Source:</dt>
  52. <dd class="tag-source"><ul class="dummy"><li>
  53. <a href="objects_Image.js.html">objects/Image.js</a>, <a href="objects_Image.js.html#line14">line 14</a>
  54. </li></ul></dd>
  55. </dl>
  56. </div>
  57. <h3 class="subsection-title">Extends</h3>
  58. <ul>
  59. <li><a href="Object2D.html">Object2D</a></li>
  60. </ul>
  61. <h3 class="subsection-title">Members</h3>
  62. <h4 class="name" id="beingDragged"><span class="type-signature"></span>beingDragged<span class="type-signature"></span></h4>
  63. <div class="description">
  64. Flag to indicate if the object is currently being dragged.
  65. </div>
  66. <dl class="details">
  67. <dt class="inherited-from">Inherited From:</dt>
  68. <dd class="inherited-from"><ul class="dummy"><li>
  69. <a href="Object2D.html#beingDragged">Object2D#beingDragged</a>
  70. </li></ul></dd>
  71. <dt class="tag-source">Source:</dt>
  72. <dd class="tag-source"><ul class="dummy"><li>
  73. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line142">line 142</a>
  74. </li></ul></dd>
  75. </dl>
  76. <h4 class="name" id="box"><span class="type-signature"></span>box<span class="type-signature"></span></h4>
  77. <div class="description">
  78. Box object containing the size of the object.
  79. </div>
  80. <dl class="details">
  81. <dt class="tag-source">Source:</dt>
  82. <dd class="tag-source"><ul class="dummy"><li>
  83. <a href="objects_Image.js.html">objects/Image.js</a>, <a href="objects_Image.js.html#line21">line 21</a>
  84. </li></ul></dd>
  85. </dl>
  86. <h4 class="name" id="children"><span class="type-signature"></span>children<span class="type-signature"></span></h4>
  87. <div class="description">
  88. List of children objects attached to the object.
  89. </div>
  90. <dl class="details">
  91. <dt class="inherited-from">Inherited From:</dt>
  92. <dd class="inherited-from"><ul class="dummy"><li>
  93. <a href="Object2D.html#children">Object2D#children</a>
  94. </li></ul></dd>
  95. <dt class="tag-source">Source:</dt>
  96. <dd class="tag-source"><ul class="dummy"><li>
  97. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line26">line 26</a>
  98. </li></ul></dd>
  99. </dl>
  100. <h4 class="name" id="draggable"><span class="type-signature"></span>draggable<span class="type-signature"></span></h4>
  101. <div class="description">
  102. Indicates if its possible to drag the object around. If true the onPointerDrag callback is used to update the state of the object.
  103. </div>
  104. <dl class="details">
  105. <dt class="inherited-from">Inherited From:</dt>
  106. <dd class="inherited-from"><ul class="dummy"><li>
  107. <a href="Object2D.html#draggable">Object2D#draggable</a>
  108. </li></ul></dd>
  109. <dt class="tag-source">Source:</dt>
  110. <dd class="tag-source"><ul class="dummy"><li>
  111. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line108">line 108</a>
  112. </li></ul></dd>
  113. </dl>
  114. <h4 class="name" id="globalMatrix"><span class="type-signature"></span>globalMatrix<span class="type-signature"></span></h4>
  115. <div class="description">
  116. Global transformation matrix multiplied by the parent matrix. Used to transform the object before projecting into screen coordinates.
  117. </div>
  118. <dl class="details">
  119. <dt class="inherited-from">Inherited From:</dt>
  120. <dd class="inherited-from"><ul class="dummy"><li>
  121. <a href="Object2D.html#globalMatrix">Object2D#globalMatrix</a>
  122. </li></ul></dd>
  123. <dt class="tag-source">Source:</dt>
  124. <dd class="tag-source"><ul class="dummy"><li>
  125. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line82">line 82</a>
  126. </li></ul></dd>
  127. </dl>
  128. <h4 class="name" id="ignoreViewport"><span class="type-signature"></span>ignoreViewport<span class="type-signature"></span></h4>
  129. <div class="description">
  130. Flag to indicate wheter this objet ignores the viewport transformation.
  131. </div>
  132. <dl class="details">
  133. <dt class="inherited-from">Inherited From:</dt>
  134. <dd class="inherited-from"><ul class="dummy"><li>
  135. <a href="Object2D.html#ignoreViewport">Object2D#ignoreViewport</a>
  136. </li></ul></dd>
  137. <dt class="tag-source">Source:</dt>
  138. <dd class="tag-source"><ul class="dummy"><li>
  139. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line120">line 120</a>
  140. </li></ul></dd>
  141. </dl>
  142. <h4 class="name" id="image"><span class="type-signature"></span>image<span class="type-signature"></span></h4>
  143. <div class="description">
  144. Image source DOM element.
  145. </div>
  146. <dl class="details">
  147. <dt class="tag-source">Source:</dt>
  148. <dd class="tag-source"><ul class="dummy"><li>
  149. <a href="objects_Image.js.html">objects/Image.js</a>, <a href="objects_Image.js.html#line26">line 26</a>
  150. </li></ul></dd>
  151. </dl>
  152. <h4 class="name" id="inverseGlobalMatrix"><span class="type-signature"></span>inverseGlobalMatrix<span class="type-signature"></span></h4>
  153. <div class="description">
  154. Inverse of the global matrix. Used to convert pointer input points into object coordinates.
  155. </div>
  156. <dl class="details">
  157. <dt class="inherited-from">Inherited From:</dt>
  158. <dd class="inherited-from"><ul class="dummy"><li>
  159. <a href="Object2D.html#inverseGlobalMatrix">Object2D#inverseGlobalMatrix</a>
  160. </li></ul></dd>
  161. <dt class="tag-source">Source:</dt>
  162. <dd class="tag-source"><ul class="dummy"><li>
  163. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line89">line 89</a>
  164. </li></ul></dd>
  165. </dl>
  166. <h4 class="name" id="layer"><span class="type-signature"></span>layer<span class="type-signature"></span></h4>
  167. <div class="description">
  168. Layer of this object, objects are sorted by layer value. Lower layer value is draw first.
  169. </div>
  170. <dl class="details">
  171. <dt class="inherited-from">Inherited From:</dt>
  172. <dd class="inherited-from"><ul class="dummy"><li>
  173. <a href="Object2D.html#layer">Object2D#layer</a>
  174. </li></ul></dd>
  175. <dt class="tag-source">Source:</dt>
  176. <dd class="tag-source"><ul class="dummy"><li>
  177. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line70">line 70</a>
  178. </li></ul></dd>
  179. </dl>
  180. <h4 class="name" id="level"><span class="type-signature"></span>level<span class="type-signature"></span></h4>
  181. <div class="description">
  182. Depth level in the object tree, objects with higher depth are drawn on top. The layer value is considered first.
  183. </div>
  184. <dl class="details">
  185. <dt class="inherited-from">Inherited From:</dt>
  186. <dd class="inherited-from"><ul class="dummy"><li>
  187. <a href="Object2D.html#level">Object2D#level</a>
  188. </li></ul></dd>
  189. <dt class="tag-source">Source:</dt>
  190. <dd class="tag-source"><ul class="dummy"><li>
  191. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line38">line 38</a>
  192. </li></ul></dd>
  193. </dl>
  194. <h4 class="name" id="masks"><span class="type-signature"></span>masks<span class="type-signature"></span></h4>
  195. <div class="description">
  196. Masks being applied to this object. Multiple masks can be used simultaneously.
  197. </div>
  198. <dl class="details">
  199. <dt class="inherited-from">Inherited From:</dt>
  200. <dd class="inherited-from"><ul class="dummy"><li>
  201. <a href="Object2D.html#masks">Object2D#masks</a>
  202. </li></ul></dd>
  203. <dt class="tag-source">Source:</dt>
  204. <dd class="tag-source"><ul class="dummy"><li>
  205. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line96">line 96</a>
  206. </li></ul></dd>
  207. </dl>
  208. <h4 class="name" id="matrix"><span class="type-signature"></span>matrix<span class="type-signature"></span></h4>
  209. <div class="description">
  210. Local transformation matrix applied to the object.
  211. </div>
  212. <dl class="details">
  213. <dt class="inherited-from">Inherited From:</dt>
  214. <dd class="inherited-from"><ul class="dummy"><li>
  215. <a href="Object2D.html#matrix">Object2D#matrix</a>
  216. </li></ul></dd>
  217. <dt class="tag-source">Source:</dt>
  218. <dd class="tag-source"><ul class="dummy"><li>
  219. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line75">line 75</a>
  220. </li></ul></dd>
  221. </dl>
  222. <h4 class="name" id="matrixNeedsUpdate"><span class="type-signature"></span>matrixNeedsUpdate<span class="type-signature"></span></h4>
  223. <div class="description">
  224. If true the matrix is updated before rendering the object.
  225. </div>
  226. <dl class="details">
  227. <dt class="inherited-from">Inherited From:</dt>
  228. <dd class="inherited-from"><ul class="dummy"><li>
  229. <a href="Object2D.html#matrixNeedsUpdate">Object2D#matrixNeedsUpdate</a>
  230. </li></ul></dd>
  231. <dt class="tag-source">Source:</dt>
  232. <dd class="tag-source"><ul class="dummy"><li>
  233. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line101">line 101</a>
  234. </li></ul></dd>
  235. </dl>
  236. <h4 class="name" id="onAdd"><span class="type-signature"></span>onAdd<span class="type-signature"></span></h4>
  237. <div class="description">
  238. Method called when the object its added to a parent.
  239. </div>
  240. <dl class="details">
  241. <dt class="inherited-from">Inherited From:</dt>
  242. <dd class="inherited-from"><ul class="dummy"><li>
  243. <a href="Object2D.html#onAdd">Object2D#onAdd</a>
  244. </li></ul></dd>
  245. <dt class="tag-source">Source:</dt>
  246. <dd class="tag-source"><ul class="dummy"><li>
  247. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line316">line 316</a>
  248. </li></ul></dd>
  249. </dl>
  250. <h4 class="name" id="onButtonDown"><span class="type-signature"></span>onButtonDown<span class="type-signature"></span></h4>
  251. <div class="description">
  252. Callback method called when the pointer button is pressed down (single time). Receives (pointer, viewport) as arguments.
  253. </div>
  254. <dl class="details">
  255. <dt class="inherited-from">Inherited From:</dt>
  256. <dd class="inherited-from"><ul class="dummy"><li>
  257. <a href="Object2D.html#onButtonDown">Object2D#onButtonDown</a>
  258. </li></ul></dd>
  259. <dt class="tag-source">Source:</dt>
  260. <dd class="tag-source"><ul class="dummy"><li>
  261. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line390">line 390</a>
  262. </li></ul></dd>
  263. </dl>
  264. <h4 class="name" id="onButtonPressed"><span class="type-signature"></span>onButtonPressed<span class="type-signature"></span></h4>
  265. <div class="description">
  266. Callback method called while the pointer button is pressed. Receives (pointer, viewport) as arguments.
  267. </div>
  268. <dl class="details">
  269. <dt class="inherited-from">Inherited From:</dt>
  270. <dd class="inherited-from"><ul class="dummy"><li>
  271. <a href="Object2D.html#onButtonPressed">Object2D#onButtonPressed</a>
  272. </li></ul></dd>
  273. <dt class="tag-source">Source:</dt>
  274. <dd class="tag-source"><ul class="dummy"><li>
  275. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line370">line 370</a>
  276. </li></ul></dd>
  277. </dl>
  278. <h4 class="name" id="onButtonUp"><span class="type-signature"></span>onButtonUp<span class="type-signature"></span></h4>
  279. <div class="description">
  280. Callback method called when the pointer button is released (single time). Receives (pointer, viewport) as arguments.
  281. </div>
  282. <dl class="details">
  283. <dt class="inherited-from">Inherited From:</dt>
  284. <dd class="inherited-from"><ul class="dummy"><li>
  285. <a href="Object2D.html#onButtonUp">Object2D#onButtonUp</a>
  286. </li></ul></dd>
  287. <dt class="tag-source">Source:</dt>
  288. <dd class="tag-source"><ul class="dummy"><li>
  289. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line400">line 400</a>
  290. </li></ul></dd>
  291. </dl>
  292. <h4 class="name" id="onDoubleClick"><span class="type-signature"></span>onDoubleClick<span class="type-signature"></span></h4>
  293. <div class="description">
  294. Callback method called while the pointer button is double clicked. Receives (pointer, viewport) as arguments.
  295. </div>
  296. <dl class="details">
  297. <dt class="inherited-from">Inherited From:</dt>
  298. <dd class="inherited-from"><ul class="dummy"><li>
  299. <a href="Object2D.html#onDoubleClick">Object2D#onDoubleClick</a>
  300. </li></ul></dd>
  301. <dt class="tag-source">Source:</dt>
  302. <dd class="tag-source"><ul class="dummy"><li>
  303. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line380">line 380</a>
  304. </li></ul></dd>
  305. </dl>
  306. <h4 class="name" id="onPointerEnter"><span class="type-signature"></span>onPointerEnter<span class="type-signature"></span></h4>
  307. <div class="description">
  308. Callback method called when the pointer enters the object. Receives (pointer, viewport) as arguments.
  309. </div>
  310. <dl class="details">
  311. <dt class="inherited-from">Inherited From:</dt>
  312. <dd class="inherited-from"><ul class="dummy"><li>
  313. <a href="Object2D.html#onPointerEnter">Object2D#onPointerEnter</a>
  314. </li></ul></dd>
  315. <dt class="tag-source">Source:</dt>
  316. <dd class="tag-source"><ul class="dummy"><li>
  317. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line340">line 340</a>
  318. </li></ul></dd>
  319. </dl>
  320. <h4 class="name" id="onPointerLeave"><span class="type-signature"></span>onPointerLeave<span class="type-signature"></span></h4>
  321. <div class="description">
  322. Callback method called when the was inside of the object and leaves the object. Receives (pointer, viewport) as arguments.
  323. </div>
  324. <dl class="details">
  325. <dt class="inherited-from">Inherited From:</dt>
  326. <dd class="inherited-from"><ul class="dummy"><li>
  327. <a href="Object2D.html#onPointerLeave">Object2D#onPointerLeave</a>
  328. </li></ul></dd>
  329. <dt class="tag-source">Source:</dt>
  330. <dd class="tag-source"><ul class="dummy"><li>
  331. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line350">line 350</a>
  332. </li></ul></dd>
  333. </dl>
  334. <h4 class="name" id="onPointerOver"><span class="type-signature"></span>onPointerOver<span class="type-signature"></span></h4>
  335. <div class="description">
  336. Callback method while the pointer is over (inside) of the object. Receives (pointer, viewport) as arguments.
  337. </div>
  338. <dl class="details">
  339. <dt class="inherited-from">Inherited From:</dt>
  340. <dd class="inherited-from"><ul class="dummy"><li>
  341. <a href="Object2D.html#onPointerOver">Object2D#onPointerOver</a>
  342. </li></ul></dd>
  343. <dt class="tag-source">Source:</dt>
  344. <dd class="tag-source"><ul class="dummy"><li>
  345. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line360">line 360</a>
  346. </li></ul></dd>
  347. </dl>
  348. <h4 class="name" id="onRemove"><span class="type-signature"></span>onRemove<span class="type-signature"></span></h4>
  349. <div class="description">
  350. Method called when the object gets removed from its parent
  351. </div>
  352. <dl class="details">
  353. <dt class="inherited-from">Inherited From:</dt>
  354. <dd class="inherited-from"><ul class="dummy"><li>
  355. <a href="Object2D.html#onRemove">Object2D#onRemove</a>
  356. </li></ul></dd>
  357. <dt class="tag-source">Source:</dt>
  358. <dd class="tag-source"><ul class="dummy"><li>
  359. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line323">line 323</a>
  360. </li></ul></dd>
  361. </dl>
  362. <h4 class="name" id="onUpdate"><span class="type-signature"></span>onUpdate<span class="type-signature"></span></h4>
  363. <div class="description">
  364. Callback method called every time before the object is draw into the canvas. Can be used to run preparation code, move the object, etc.
  365. </div>
  366. <dl class="details">
  367. <dt class="inherited-from">Inherited From:</dt>
  368. <dd class="inherited-from"><ul class="dummy"><li>
  369. <a href="Object2D.html#onUpdate">Object2D#onUpdate</a>
  370. </li></ul></dd>
  371. <dt class="tag-source">Source:</dt>
  372. <dd class="tag-source"><ul class="dummy"><li>
  373. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line330">line 330</a>
  374. </li></ul></dd>
  375. </dl>
  376. <h4 class="name" id="origin"><span class="type-signature"></span>origin<span class="type-signature"></span></h4>
  377. <div class="description">
  378. Origin of the object used as point of rotation.
  379. </div>
  380. <dl class="details">
  381. <dt class="inherited-from">Inherited From:</dt>
  382. <dd class="inherited-from"><ul class="dummy"><li>
  383. <a href="Object2D.html#origin">Object2D#origin</a>
  384. </li></ul></dd>
  385. <dt class="tag-source">Source:</dt>
  386. <dd class="tag-source"><ul class="dummy"><li>
  387. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line48">line 48</a>
  388. </li></ul></dd>
  389. </dl>
  390. <h4 class="name" id="parent"><span class="type-signature"></span>parent<span class="type-signature"></span></h4>
  391. <div class="description">
  392. Parent object, the object position is affected by its parent position.
  393. </div>
  394. <dl class="details">
  395. <dt class="inherited-from">Inherited From:</dt>
  396. <dd class="inherited-from"><ul class="dummy"><li>
  397. <a href="Object2D.html#parent">Object2D#parent</a>
  398. </li></ul></dd>
  399. <dt class="tag-source">Source:</dt>
  400. <dd class="tag-source"><ul class="dummy"><li>
  401. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line31">line 31</a>
  402. </li></ul></dd>
  403. </dl>
  404. <h4 class="name" id="pointerEvents"><span class="type-signature"></span>pointerEvents<span class="type-signature"></span></h4>
  405. <div class="description">
  406. Indicates if this object uses pointer events. Can be set false to skip the pointer interaction events.
  407. </div>
  408. <dl class="details">
  409. <dt class="inherited-from">Inherited From:</dt>
  410. <dd class="inherited-from"><ul class="dummy"><li>
  411. <a href="Object2D.html#pointerEvents">Object2D#pointerEvents</a>
  412. </li></ul></dd>
  413. <dt class="tag-source">Source:</dt>
  414. <dd class="tag-source"><ul class="dummy"><li>
  415. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line115">line 115</a>
  416. </li></ul></dd>
  417. </dl>
  418. <h4 class="name" id="pointerInside"><span class="type-signature"></span>pointerInside<span class="type-signature"></span></h4>
  419. <div class="description">
  420. Flag indicating if the pointer is inside of the element. Used to control object event.
  421. </div>
  422. <dl class="details">
  423. <dt class="inherited-from">Inherited From:</dt>
  424. <dd class="inherited-from"><ul class="dummy"><li>
  425. <a href="Object2D.html#pointerInside">Object2D#pointerInside</a>
  426. </li></ul></dd>
  427. <dt class="tag-source">Source:</dt>
  428. <dd class="tag-source"><ul class="dummy"><li>
  429. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line137">line 137</a>
  430. </li></ul></dd>
  431. </dl>
  432. <h4 class="name" id="position"><span class="type-signature"></span>position<span class="type-signature"></span></h4>
  433. <div class="description">
  434. Position of the object.
  435. </div>
  436. <dl class="details">
  437. <dt class="inherited-from">Inherited From:</dt>
  438. <dd class="inherited-from"><ul class="dummy"><li>
  439. <a href="Object2D.html#position">Object2D#position</a>
  440. </li></ul></dd>
  441. <dt class="tag-source">Source:</dt>
  442. <dd class="tag-source"><ul class="dummy"><li>
  443. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line43">line 43</a>
  444. </li></ul></dd>
  445. </dl>
  446. <h4 class="name" id="restoreContextState"><span class="type-signature"></span>restoreContextState<span class="type-signature"></span></h4>
  447. <div class="description">
  448. Flag to indicate if the context of canvas should be restored after render.
  449. </div>
  450. <dl class="details">
  451. <dt class="inherited-from">Inherited From:</dt>
  452. <dd class="inherited-from"><ul class="dummy"><li>
  453. <a href="Object2D.html#restoreContextState">Object2D#restoreContextState</a>
  454. </li></ul></dd>
  455. <dt class="tag-source">Source:</dt>
  456. <dd class="tag-source"><ul class="dummy"><li>
  457. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line130">line 130</a>
  458. </li></ul></dd>
  459. </dl>
  460. <h4 class="name" id="rotation"><span class="type-signature"></span>rotation<span class="type-signature"></span></h4>
  461. <div class="description">
  462. Rotation of the object relative to its center.
  463. </div>
  464. <dl class="details">
  465. <dt class="inherited-from">Inherited From:</dt>
  466. <dd class="inherited-from"><ul class="dummy"><li>
  467. <a href="Object2D.html#rotation">Object2D#rotation</a>
  468. </li></ul></dd>
  469. <dt class="tag-source">Source:</dt>
  470. <dd class="tag-source"><ul class="dummy"><li>
  471. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line58">line 58</a>
  472. </li></ul></dd>
  473. </dl>
  474. <h4 class="name" id="saveContextState"><span class="type-signature"></span>saveContextState<span class="type-signature"></span></h4>
  475. <div class="description">
  476. Flag to indicate if the context of canvas should be saved before render.
  477. </div>
  478. <dl class="details">
  479. <dt class="inherited-from">Inherited From:</dt>
  480. <dd class="inherited-from"><ul class="dummy"><li>
  481. <a href="Object2D.html#saveContextState">Object2D#saveContextState</a>
  482. </li></ul></dd>
  483. <dt class="tag-source">Source:</dt>
  484. <dd class="tag-source"><ul class="dummy"><li>
  485. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line125">line 125</a>
  486. </li></ul></dd>
  487. </dl>
  488. <h4 class="name" id="scale"><span class="type-signature"></span>scale<span class="type-signature"></span></h4>
  489. <div class="description">
  490. Scale of the object.
  491. </div>
  492. <dl class="details">
  493. <dt class="inherited-from">Inherited From:</dt>
  494. <dd class="inherited-from"><ul class="dummy"><li>
  495. <a href="Object2D.html#scale">Object2D#scale</a>
  496. </li></ul></dd>
  497. <dt class="tag-source">Source:</dt>
  498. <dd class="tag-source"><ul class="dummy"><li>
  499. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line53">line 53</a>
  500. </li></ul></dd>
  501. </dl>
  502. <h4 class="name" id="uuid"><span class="type-signature"></span>uuid<span class="type-signature"></span></h4>
  503. <div class="description">
  504. UUID of the object.
  505. </div>
  506. <dl class="details">
  507. <dt class="inherited-from">Inherited From:</dt>
  508. <dd class="inherited-from"><ul class="dummy"><li>
  509. <a href="Object2D.html#uuid">Object2D#uuid</a>
  510. </li></ul></dd>
  511. <dt class="tag-source">Source:</dt>
  512. <dd class="tag-source"><ul class="dummy"><li>
  513. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line21">line 21</a>
  514. </li></ul></dd>
  515. </dl>
  516. <h4 class="name" id="visible"><span class="type-signature"></span>visible<span class="type-signature"></span></h4>
  517. <div class="description">
  518. Indicates if the object is visible.
  519. </div>
  520. <dl class="details">
  521. <dt class="inherited-from">Inherited From:</dt>
  522. <dd class="inherited-from"><ul class="dummy"><li>
  523. <a href="Object2D.html#visible">Object2D#visible</a>
  524. </li></ul></dd>
  525. <dt class="tag-source">Source:</dt>
  526. <dd class="tag-source"><ul class="dummy"><li>
  527. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line63">line 63</a>
  528. </li></ul></dd>
  529. </dl>
  530. <h3 class="subsection-title">Methods</h3>
  531. <h4 class="name" id="add"><span class="type-signature"></span>add<span class="signature">(object)</span><span class="type-signature"></span></h4>
  532. <div class="description">
  533. Attach a children to this object. The object is set as children of this object and the transformations applied to this object are traversed to its children.
  534. </div>
  535. <h5>Parameters:</h5>
  536. <table class="params">
  537. <thead>
  538. <tr>
  539. <th>Name</th>
  540. <th>Type</th>
  541. <th class="last">Description</th>
  542. </tr>
  543. </thead>
  544. <tbody>
  545. <tr>
  546. <td class="name"><code>object</code></td>
  547. <td class="type">
  548. <span class="param-type"><a href="Object2D.html">Object2D</a></span>
  549. </td>
  550. <td class="description last">Object to attach to this object.</td>
  551. </tr>
  552. </tbody>
  553. </table>
  554. <dl class="details">
  555. <dt class="inherited-from">Inherited From:</dt>
  556. <dd class="inherited-from"><ul class="dummy"><li>
  557. <a href="Object2D.html#add">Object2D#add</a>
  558. </li></ul></dd>
  559. <dt class="tag-source">Source:</dt>
  560. <dd class="tag-source"><ul class="dummy"><li>
  561. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line190">line 190</a>
  562. </li></ul></dd>
  563. </dl>
  564. <h4 class="name" id="draw"><span class="type-signature"></span>draw<span class="signature">(context, viewport, canvas)</span><span class="type-signature"></span></h4>
  565. <div class="description">
  566. Draw the object into the canvas. Has to be implemented by underlying classes.
  567. </div>
  568. <h5>Parameters:</h5>
  569. <table class="params">
  570. <thead>
  571. <tr>
  572. <th>Name</th>
  573. <th>Type</th>
  574. <th class="last">Description</th>
  575. </tr>
  576. </thead>
  577. <tbody>
  578. <tr>
  579. <td class="name"><code>context</code></td>
  580. <td class="type">
  581. <span class="param-type">CanvasContext</span>
  582. </td>
  583. <td class="description last">Canvas 2d drawing context.</td>
  584. </tr>
  585. <tr>
  586. <td class="name"><code>viewport</code></td>
  587. <td class="type">
  588. <span class="param-type"><a href="Viewport.html">Viewport</a></span>
  589. </td>
  590. <td class="description last">Viewport applied to the canvas.</td>
  591. </tr>
  592. <tr>
  593. <td class="name"><code>canvas</code></td>
  594. <td class="type">
  595. <span class="param-type"><a href="DOM.html">DOM</a></span>
  596. </td>
  597. <td class="description last">DOM canvas element where the content is being drawn.</td>
  598. </tr>
  599. </tbody>
  600. </table>
  601. <dl class="details">
  602. <dt class="tag-overrides">Overrides:</dt>
  603. <dd class="tag-overrides"><ul class="dummy"><li>
  604. <a href="Object2D.html#draw">Object2D#draw</a>
  605. </li></ul></dd>
  606. <dt class="tag-source">Source:</dt>
  607. <dd class="tag-source"><ul class="dummy"><li>
  608. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line291">line 291</a>
  609. </li></ul></dd>
  610. </dl>
  611. <h4 class="name" id="getChildByUUID"><span class="type-signature"></span>getChildByUUID<span class="signature">(uuid)</span><span class="type-signature"> &rarr; {<a href="Object2D.html">Object2D</a>}</span></h4>
  612. <div class="description">
  613. Get a object from its children list by its UUID.
  614. </div>
  615. <h5>Parameters:</h5>
  616. <table class="params">
  617. <thead>
  618. <tr>
  619. <th>Name</th>
  620. <th>Type</th>
  621. <th class="last">Description</th>
  622. </tr>
  623. </thead>
  624. <tbody>
  625. <tr>
  626. <td class="name"><code>uuid</code></td>
  627. <td class="type">
  628. <span class="param-type">String</span>
  629. </td>
  630. <td class="description last">UUID of the object to get.</td>
  631. </tr>
  632. </tbody>
  633. </table>
  634. <dl class="details">
  635. <dt class="inherited-from">Inherited From:</dt>
  636. <dd class="inherited-from"><ul class="dummy"><li>
  637. <a href="Object2D.html#getChildByUUID">Object2D#getChildByUUID</a>
  638. </li></ul></dd>
  639. <dt class="tag-source">Source:</dt>
  640. <dd class="tag-source"><ul class="dummy"><li>
  641. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line168">line 168</a>
  642. </li></ul></dd>
  643. </dl>
  644. <h5>Returns:</h5>
  645. <div class="param-desc">
  646. The object that has the UUID specified, null if the object was not found.
  647. </div>
  648. <dl>
  649. <dt>
  650. Type
  651. </dt>
  652. <dd>
  653. <span class="param-type"><a href="Object2D.html">Object2D</a></span>
  654. </dd>
  655. </dl>
  656. <h4 class="name" id="isInside"><span class="type-signature"></span>isInside<span class="signature">()</span><span class="type-signature"> &rarr; {boolean}</span></h4>
  657. <div class="description">
  658. Check if a point is inside of the object. Used to update the point events attached to the object.
  659. </div>
  660. <dl class="details">
  661. <dt class="tag-overrides">Overrides:</dt>
  662. <dd class="tag-overrides"><ul class="dummy"><li>
  663. <a href="Object2D.html#isInside">Object2D#isInside</a>
  664. </li></ul></dd>
  665. <dt class="tag-source">Source:</dt>
  666. <dd class="tag-source"><ul class="dummy"><li>
  667. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line240">line 240</a>
  668. </li></ul></dd>
  669. </dl>
  670. <h5>Returns:</h5>
  671. <div class="param-desc">
  672. True if the point is inside of the object.
  673. </div>
  674. <dl>
  675. <dt>
  676. Type
  677. </dt>
  678. <dd>
  679. <span class="param-type">boolean</span>
  680. </dd>
  681. </dl>
  682. <h4 class="name" id="onPointerDrag"><span class="type-signature"></span>onPointerDrag<span class="signature">(pointer, viewport, delta)</span><span class="type-signature"></span></h4>
  683. <div class="description">
  684. Callback method while the object is being dragged across the screen. By default is adds the delta value to the object position (making it follow the mouse movement). Delta is the movement of the pointer already translated into local object coordinates. Receives (pointer, viewport, delta) as arguments.
  685. </div>
  686. <h5>Parameters:</h5>
  687. <table class="params">
  688. <thead>
  689. <tr>
  690. <th>Name</th>
  691. <th>Type</th>
  692. <th class="last">Description</th>
  693. </tr>
  694. </thead>
  695. <tbody>
  696. <tr>
  697. <td class="name"><code>pointer</code></td>
  698. <td class="type">
  699. <span class="param-type"><a href="Pointer.html">Pointer</a></span>
  700. </td>
  701. <td class="description last">Pointer object that receives the user input.</td>
  702. </tr>
  703. <tr>
  704. <td class="name"><code>viewport</code></td>
  705. <td class="type">
  706. <span class="param-type"><a href="Viewport.html">Viewport</a></span>
  707. </td>
  708. <td class="description last">Viewport where the object is drawn.</td>
  709. </tr>
  710. <tr>
  711. <td class="name"><code>delta</code></td>
  712. <td class="type">
  713. <span class="param-type"><a href="Vector2.html">Vector2</a></span>
  714. </td>
  715. <td class="description last">Pointer movement in world space.</td>
  716. </tr>
  717. </tbody>
  718. </table>
  719. <dl class="details">
  720. <dt class="inherited-from">Inherited From:</dt>
  721. <dd class="inherited-from"><ul class="dummy"><li>
  722. <a href="Object2D.html#onPointerDrag">Object2D#onPointerDrag</a>
  723. </li></ul></dd>
  724. <dt class="tag-source">Source:</dt>
  725. <dd class="tag-source"><ul class="dummy"><li>
  726. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line306">line 306</a>
  727. </li></ul></dd>
  728. </dl>
  729. <h4 class="name" id="remove"><span class="type-signature"></span>remove<span class="signature">(object)</span><span class="type-signature"></span></h4>
  730. <div class="description">
  731. Remove object from the children list.
  732. </div>
  733. <h5>Parameters:</h5>
  734. <table class="params">
  735. <thead>
  736. <tr>
  737. <th>Name</th>
  738. <th>Type</th>
  739. <th class="last">Description</th>
  740. </tr>
  741. </thead>
  742. <tbody>
  743. <tr>
  744. <td class="name"><code>object</code></td>
  745. <td class="type">
  746. <span class="param-type"><a href="Object2D.html">Object2D</a></span>
  747. </td>
  748. <td class="description last">Object to be removed.</td>
  749. </tr>
  750. </tbody>
  751. </table>
  752. <dl class="details">
  753. <dt class="inherited-from">Inherited From:</dt>
  754. <dd class="inherited-from"><ul class="dummy"><li>
  755. <a href="Object2D.html#remove">Object2D#remove</a>
  756. </li></ul></dd>
  757. <dt class="tag-source">Source:</dt>
  758. <dd class="tag-source"><ul class="dummy"><li>
  759. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line211">line 211</a>
  760. </li></ul></dd>
  761. </dl>
  762. <h4 class="name" id="setImage"><span class="type-signature"></span>setImage<span class="signature">(src)</span><span class="type-signature"></span></h4>
  763. <div class="description">
  764. Set the image of the object. Automatically sets the box size to match the image.
  765. </div>
  766. <h5>Parameters:</h5>
  767. <table class="params">
  768. <thead>
  769. <tr>
  770. <th>Name</th>
  771. <th>Type</th>
  772. <th class="last">Description</th>
  773. </tr>
  774. </thead>
  775. <tbody>
  776. <tr>
  777. <td class="name"><code>src</code></td>
  778. <td class="type">
  779. <span class="param-type">string</span>
  780. </td>
  781. <td class="description last">Source URL of the image.</td>
  782. </tr>
  783. </tbody>
  784. </table>
  785. <dl class="details">
  786. <dt class="tag-source">Source:</dt>
  787. <dd class="tag-source"><ul class="dummy"><li>
  788. <a href="objects_Image.js.html">objects/Image.js</a>, <a href="objects_Image.js.html#line43">line 43</a>
  789. </li></ul></dd>
  790. </dl>
  791. <h4 class="name" id="transform"><span class="type-signature"></span>transform<span class="signature">(context, viewport)</span><span class="type-signature"></span></h4>
  792. <div class="description">
  793. Apply the transform to the rendering context. It is assumed that the viewport transform is pre-applied to the context. Can also be used for pre rendering logic.
  794. </div>
  795. <h5>Parameters:</h5>
  796. <table class="params">
  797. <thead>
  798. <tr>
  799. <th>Name</th>
  800. <th>Type</th>
  801. <th class="last">Description</th>
  802. </tr>
  803. </thead>
  804. <tbody>
  805. <tr>
  806. <td class="name"><code>context</code></td>
  807. <td class="type">
  808. <span class="param-type">CanvasContext</span>
  809. </td>
  810. <td class="description last">Canvas 2d drawing context.</td>
  811. </tr>
  812. <tr>
  813. <td class="name"><code>viewport</code></td>
  814. <td class="type">
  815. <span class="param-type"><a href="Viewport.html">Viewport</a></span>
  816. </td>
  817. <td class="description last">Viewport applied to the canvas.</td>
  818. </tr>
  819. </tbody>
  820. </table>
  821. <dl class="details">
  822. <dt class="inherited-from">Inherited From:</dt>
  823. <dd class="inherited-from"><ul class="dummy"><li>
  824. <a href="Object2D.html#transform">Object2D#transform</a>
  825. </li></ul></dd>
  826. <dt class="tag-source">Source:</dt>
  827. <dd class="tag-source"><ul class="dummy"><li>
  828. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line277">line 277</a>
  829. </li></ul></dd>
  830. </dl>
  831. <h4 class="name" id="traverse"><span class="type-signature"></span>traverse<span class="signature">(callback)</span><span class="type-signature"></span></h4>
  832. <div class="description">
  833. Traverse the object tree and run a function for all objects.
  834. </div>
  835. <h5>Parameters:</h5>
  836. <table class="params">
  837. <thead>
  838. <tr>
  839. <th>Name</th>
  840. <th>Type</th>
  841. <th class="last">Description</th>
  842. </tr>
  843. </thead>
  844. <tbody>
  845. <tr>
  846. <td class="name"><code>callback</code></td>
  847. <td class="type">
  848. <span class="param-type">function</span>
  849. </td>
  850. <td class="description last">Callback function that receives the object as parameter.</td>
  851. </tr>
  852. </tbody>
  853. </table>
  854. <dl class="details">
  855. <dt class="inherited-from">Inherited From:</dt>
  856. <dd class="inherited-from"><ul class="dummy"><li>
  857. <a href="Object2D.html#traverse">Object2D#traverse</a>
  858. </li></ul></dd>
  859. <dt class="tag-source">Source:</dt>
  860. <dd class="tag-source"><ul class="dummy"><li>
  861. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line150">line 150</a>
  862. </li></ul></dd>
  863. </dl>
  864. <h4 class="name" id="updateMatrix"><span class="type-signature"></span>updateMatrix<span class="signature">(context)</span><span class="type-signature"></span></h4>
  865. <div class="description">
  866. Update the transformation matrix of the object.
  867. </div>
  868. <h5>Parameters:</h5>
  869. <table class="params">
  870. <thead>
  871. <tr>
  872. <th>Name</th>
  873. <th>Type</th>
  874. <th class="last">Description</th>
  875. </tr>
  876. </thead>
  877. <tbody>
  878. <tr>
  879. <td class="name"><code>context</code></td>
  880. <td class="type">
  881. <span class="param-type">CanvasContext</span>
  882. </td>
  883. <td class="description last"></td>
  884. </tr>
  885. </tbody>
  886. </table>
  887. <dl class="details">
  888. <dt class="inherited-from">Inherited From:</dt>
  889. <dd class="inherited-from"><ul class="dummy"><li>
  890. <a href="Object2D.html#updateMatrix">Object2D#updateMatrix</a>
  891. </li></ul></dd>
  892. <dt class="tag-source">Source:</dt>
  893. <dd class="tag-source"><ul class="dummy"><li>
  894. <a href="Object2D.js.html">Object2D.js</a>, <a href="Object2D.js.html#line250">line 250</a>
  895. </li></ul></dd>
  896. </dl>
  897. </article>
  898. </section>
  899. </div>
  900. <nav>
  901. <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="BezierCurve.html">BezierCurve</a></li><li><a href="Box.html">Box</a></li><li><a href="Box2.html">Box2</a></li><li><a href="BoxMask.html">BoxMask</a></li><li><a href="Circle.html">Circle</a></li><li><a href="DOM.html">DOM</a></li><li><a href="EventManager.html">EventManager</a></li><li><a href="Graph.html">Graph</a></li><li><a href="Helpers.html">Helpers</a></li><li><a href="Image.html">Image</a></li><li><a href="Key.html">Key</a></li><li><a href="Line.html">Line</a></li><li><a href="Mask.html">Mask</a></li><li><a href="Matrix.html">Matrix</a></li><li><a href="Object2D.html">Object2D</a></li><li><a href="Pattern.html">Pattern</a></li><li><a href="Pointer.html">Pointer</a></li><li><a href="Renderer.html">Renderer</a></li><li><a href="Text.html">Text</a></li><li><a href="UUID.html">UUID</a></li><li><a href="Vector2.html">Vector2</a></li><li><a href="Viewport.html">Viewport</a></li><li><a href="ViewportControls.html">ViewportControls</a></li></ul>
  902. </nav>
  903. <br class="clear">
  904. <footer>
  905. Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 3.6.2</a> on Tue Jun 25 2019 14:27:21 GMT+0100 (Western European Summer Time)
  906. </footer>
  907. <script> prettyPrint(); </script>
  908. <script src="scripts/linenumber.js"> </script>
  909. </body>
  910. </html>