4babfb1d52
fab79df7c65bbff87c13bc544b013b9417d67890 80299b1a2b8673349c7e4f8a74638d561393b79c 4707349028884edb7cad595b5c07c7c05306b96b 78b19046b463e81a2f00cc8acdfc00ff08360fcd 5b1d8ba96093133ba928fe531c021904b880a34f 806cd08257f26debec7c19acb1aeaa4a51bba070 36dc89da1c664aa4457ef5329cba3f98e678589c 5344bebe1d199aa0bb89d41a423fd97cc01a71b6 862940d2ace28cd8465b587672060d3d84ed82cc 6a6c252a559203d6cb9a2cd67c93032f77eb8c6e 3ab8f4a70b185f0135fa3ccfe4ea5433c60fdded 95d23d8c175d6f661cbbbba1cc840e1d0103359c a6cbf9658fb5c20ba93fdd478b2c5b16569a5133 dc6ab7da08e1eb7a0d9219ad47216f992381590b ec1e8a3d855849b1f511612de01d8d48b9123da8 e5f6af532063768198f841d0f8557f771eee66ac 56fbe57dd92bdd39244f7c0e46ef5a91a87acc81 196c33a161b8be2a5181a48de63bd9de62047196 1063f685725edfd5ce5467de56f0752d2581de51 93da44593f7a4eff50fc5fe160b4cfe9effa0aa6 53147d7e391457a23a24ab7134ed9041eca04915 bbffee7bfdfd4b62cff73266393110707d542f0a 7068b201fb8f6063197d96162594b7ddec42131e 10db85594f31fba97c100dd66e1547680f45442f f8c45d8552ec6f1c72609fd07eb19511f62e4bbe 7db54d9066fdc9d6fc74f017d4d461bfe59829f8 9b59601b98e827d04937a593a8cdf01675290d59 ded99a233f6f805609eefa828653731e187be33d 57ba7a5075bffa9d34be79275dd8e49b921c42ba 76886ad92b981e1dc139fe5a6f5603ff80c1e58b 983c7047610a554e1805503d621b7dbb0aba6e93 03d9eed8d0997969ec3fc2713025b06809886b15 2de55f04745abb89ceb816e1e1cd22cd643e36ae e67d8a212672b1fbcf095c4877461898ca740ee9 363759e927b8f5d3219e7597c739fe91d0781638 530ab4ac8187cfceda694fab12d2ca4846f008be fc7610716e2ca972470b37dcb015761b28e0d5a6 7470bebfbe74a2b395095f4a0711230d21c05644 4e45b2fe51e926ed008bfa2492cc67b9d9233981 f7ec23122b1dcea3775b69b3bf3583b17df902f8 370b0ece9d02547f8ea4ce2d642a281e95947977 2d97d21beb6636793cba909d3d3d115cf27261bc 2116500ae1713a11da8917906b8898ebfe4e2394 b6008078ede20d4be63819a98b1e796c7e5bb588 04f7e2ac249228db91b8cd99e247ffbc495c4ee1 05a70bcf4168e8846953a164f9db881565073cc3 9824d109b0b68f5a1f6ecb1de9b5fe2648150c30 293653bc4d175f7cd48a66eee8509148613faf39 71135236f2779b2bd35abf539d1cfae9290ca3a4 58801fab1423a12f2c14d9a83cbf7e71a2ae6a7d 383838c9215aabfd53d60a6d1a91916305adb72b dd74f5b6d2787d6bd0a2089ed0dd67f303ee0ab7 005786ad3621898aea737a5fc9dcacf0995bed54 ed0c39c2acb76892bdd0c3e2fb6c8ef1a23e4f96 1113149363d9c63db3f30dbdd1db0be016d2dd74 3c6511d94e46a183ed05a39ac9f26cc3a5f07bf8 b7d5610b23f773a9caf394a91c7f1ca4ddfc97b5 9f11d79bfd2a8b96ad5a5918d0d582b6b1ec8a45 7045005296df98065dd54dca15eadfc27288ca5f f279a269581930a3d7996e1e281d808ef5fe76d1 a221d37e9851cde22fb8a4531395b721b1b0dc5f ec2361cf91b01a1e217ef364bbd26fa7f9edfa32 68600e794da2c8ac7666eb49bc312a3400cf4095 b1401a1910e562598c6427e80e0e56b9c368d60d 6dd3c0ed81b1b8f52f81daa93d12eed9b0428a40 e035cadb04834242ef192d32de52f138d7e487ec 3bc00176edeed8e29f384a8febfc9b603aa2a644 331009ccb49f9ea83f2f085858b2bbc98b7968b0 a65ea3daed5eef3c9f4c66e3aa42ecf12508d69a 2463d2c50a503a544b033eab19ef46d695f97d47 4eacde74e6c6b496dad699fa68b8545fa48f99b5 f3b3f0aca732adc9b790079f3c17f75a3c9544a9 0d4aeffb19316880b2d80cea1a12f157a7906d1a d6effaf567c81b652c543fa6beab1ddedb49ead1 c146debde83df0d3673c1d1f33bcf4b86c563ee6 42e5e724c24bfc2fbbd0d178a0ab4fc3ecb4b89a be8bec23fa2d602514f285f9b14c0fe079d773bc ac34ba7a13d867537aa83fd2e9da459e010cd39c 9c51cf0a04869eedba4f2fb13516e7f93fe7a40d 393efdd3aee5df8ec0974cbe54171dd64df8dfbe 959c635f58f7245d093468b2c98a8db29c768788 9e53d1c53d85c91785e9e694dea61a0a6f463ef1 18e4fedaf5da5f841f0b3a3d3a0a95c94f279971 626369a5d986c1d1bb0b36a4f8c7fccc4bd1bb66 b39bb4d3fdfa09e14f204215ec7b26128488af38 1a3e9845d0f95ec1de66d3fa665fc76cadce28ae 100625c6d7757230f469823c1680cd7002ac1fe3 6950b67d3703c96f85101d963a89ce300bcc8f18 fea7643e7e3f97caaf609e64e3139689fb51dfb8 4d8b5da4914612dc4cc8fff56cf678724a1c1a58 fd4ef087d57dca1eff6eae1b008ffd96edf3e202 8087dca4a9f75fdc0684f40f9ca1f3d86eba72e8 dc53feaf4178b0d280d928e62b319fdf34158e3a a0b3a687cd0a7c5788b05d79370d49516975ff93 4e2118485488cf0c98bba4b8e4d61b2747f26ee8 aa993779bb9098e0a0195c707e17cc8e69fbe413 fd2b86ea7a9a3d269f8a1c6f47f9ede76be568b3 4dba5db28df1903112d7e6630caad7c744de7380 35803dcfc959e28b025ddc16f9fdc438c9d6a64d 9a8f4f2a880ce34926a47ba1240697f4bcc32d30 805ec54f57d02eed3d9da24a3715dcc47c643829 187a783e74feb4b9d5c70cee52565dd82f388d70 549f596195e0ef30e003ed4e98b439ea21a41516 3e476e2d25b5aaee37e2eece08bbc80cac3681d4 c3c7bb28ae3ba4f18636a45dab4ab82cfabb441f 6f5acfee7b961d71237f1fd50bb3d5a5139c527e 9841de85f1faf620535e49771af34f9ca19cc617 2fc9005c6012a07eb1f6f10718e3dd85ebd617de bf2863921c1e48bc41198d8a5f3eabf205644175 c478ebec359b338a38053ff9ff72d133235b652c ea786aa4bd167542f87d5f4ce3f6e6fec76b282a abd76720eea77ce364a3706adecabec9609c4c9d 5eef82a9dc71623ddb9c3495e4b9949b68e964a0 3bdb1fff1f7d274711790ac015dd2b3a1faa286d ce5a3b8ad64c917de191500b5e470c825cd77509 f393d86b8ee386b155866031c4049ea2f4c36e67 a4b863e46438f37e75657b43ec1d73583302e0b9 875a5a3ec17b72d08bf589f52b7f3ea47464774c 51e8aa9b1a43335afac703534d3536d77add15cc 1531ea8ae6075771ee3f578b002819d98246b4f0 f7fd05cfba647af542ef6b25ceddc5737a278e78 f5af954acbda6d01ab0c50ca9752d457f28de160 c2ca8d2a8403efcb051c12ff572cb787ddb1b012 78c0d09c72a61420112ceb2b2b3a51e943da000c f29ed34ddc9c556c95117b0b6aa9459ffc6457db 140c0fbf3785d1c2531a2d7ac19f86d017236603 1f0cd4b61f58e6b7b2c13868a4be29453c7acdf0 6643469ff267be96612ebf9630d84d2736f0b4f3 6a0798062bf67424be59d093a99050abe0df2f4d ba5deb9936320b33879d6f98df339cb087eca51a 64c59914861a47162aee48a8e9f60854118617e8 4730a057ffb56e7f2a7a24d01daaa1e6789b8be5 e3a05743b0b9507d985fa27cd2e725b0e5afac45 2a64c1dd1811dedd96915460055a8c225c588d3d c6356f71ff20ba5c520c5ff845c4208d4af217a7 2dafa70ff7bd479f1d24333226d68ecaf5d2ca87 71ad4a8a8083439fecc2c45b2a530fae57eef46d 8164fef77e33563e761e138f7f02f749f5523781 14b34f4b3c6e2f7a153e5cd90af50af7a6ac396e b18ddadbe662edf559f23e2b31edf216fea28a2b 4afbba3657fabca1205bc12aa67f8269fda69d11 d1ea82b2bfab108b4f2e5abd132fb104df4dce86 b70056019827f72f5d6451163a25dc8fb9e2f1f4 b950b9f9adf2a705678bae2bb557c2dffe6f461d 3c80ed73a7c46f71896da6a9ecf3868cddf41eb4 5db860efedcc56bdf1f2c58ac74de1e1a7d76af4 47b46fb1aaa7f0d1cddb50cd309030bfd2f0efd3 b35f684478931d46925e9c11c3b264360e0c352f 8be289b7eec87561e263a3bfcd5fa1809ae173dc 722d7224f900f56d5fe20e82d4cca23946889792 85bdbdb721153eaf04f7cbf2ed2632ae6c02cdaa 6c4715f7935b42316b958e4f9025958d15654d05 be6d2dc4e4d739ef6dd354578105d7cf20e5fab2 2cffa7b643abf909daa3db10ba5ccf4a326ff91b a484fda1a6925b1e86a1bef470964f5b64c71a26 662ba3c645fa696e95f07b45e39e9c039bf24bc3 85c8b599a029607d5303695e895170fe520842e4 8e7a85d1a6addf8db6adeefc341e5470b7e1b8fd c00f0f55fc3daecac9fddfda99923e2d5d48c5bf 1fa97d248b2cfcacac041fd8eb97c99101ef4c5f a62d52a2d0655be3680c637fdaa05f2061e724fc f1ac1a8211de8fc551846a60e3c38b7262031bd5 14018f5ff66f8b401944fc4741ecaa93ce4e0b02 7629b2ab6d3b854ba5c85390e5eca76cdc3bf68d d261b57cd182fb654b515fbbf86103fae6efb5c5 d813dd91913fe2d8f927411e09d3f7a8ae60bbb3 053092c85b769a4686a3a78776e984324d0801be 9fa35524de0fa0261f62cc28608a770e2ef9b1e3 d7d1f92a131e94c8d0f7df717cedbb0a1c263cb2 59337ef8b5186487204855ebf49d0ef849770076 09dc67fa83ad34dd454f475610e8552f3b4b79c6 856f919970cbd74387c32bbd9f3945a68721b0f5 9f26ab17eb3ef3ca5a311ad1777ab506439338a6 d91ddf415851460095eb063059810d3441a1b469 201ceaba7752d75fc2cd9c4425b4920d2fbc0ad8 a6c8be822603fa120a4abc945fdd7edd64863aa8 89402a88c7e1953ee6bb7f70ef1dd39cb84896d6 278cddf04e9bf7f9da9a761be103f17bb4d824ac fb3f677e2c39cb04e7e49302eefef9b76a7b270d a5fb65ebebf614840017298e6d834c5c5e10af9b 2b81b791b325b3d02f12754ca99e3727d0705a0d 042f0f035304fd342d4657134844a126a2c74409 69821db56f549a311d4ea633354e20bcccf962d4 3277584da98b012d545ab9bfaa224ff74d64ec98 19bb8b99c33c87266aacfb9997a788dbb28e859a bf26fe41e8effeccd29be8ac6af04addc78b52f8 92fc916b866854767ac0f43ba56447c454b92af1
1184 lines
20 KiB
HTML
1184 lines
20 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>SvgRenderer - Documentation</title>
|
|
|
|
<script src="scripts/prettify/prettify.js"></script>
|
|
<script src="scripts/prettify/lang-css.js"></script>
|
|
<!--[if lt IE 9]>
|
|
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
|
<![endif]-->
|
|
<link type="text/css" rel="stylesheet" href="styles/prettify.css">
|
|
<link type="text/css" rel="stylesheet" href="styles/jsdoc.css">
|
|
</head>
|
|
<body>
|
|
|
|
<input type="checkbox" id="nav-trigger" class="nav-trigger" />
|
|
<label for="nav-trigger" class="navicon-button x">
|
|
<div class="navicon"></div>
|
|
</label>
|
|
|
|
<label for="nav-trigger" class="overlay"></label>
|
|
|
|
<nav>
|
|
<h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="BitmapSkin.html">BitmapSkin</a><ul class='methods'><li data-type='method'><a href="BitmapSkin.html#._getBitmapSize">_getBitmapSize</a></li><li data-type='method'><a href="BitmapSkin.html#calculateRotationCenter">calculateRotationCenter</a></li><li data-type='method'><a href="BitmapSkin.html#dispose">dispose</a></li><li data-type='method'><a href="BitmapSkin.html#getTexture">getTexture</a></li><li data-type='method'><a href="BitmapSkin.html#getUniforms">getUniforms</a></li><li data-type='method'><a href="BitmapSkin.html#setBitmap">setBitmap</a></li><li data-type='method'><a href="BitmapSkin.html#setRotationCenter">setRotationCenter</a></li></ul></li><li><a href="Drawable.html">Drawable</a><ul class='methods'><li data-type='method'><a href="Drawable.html#.color3bToID">color3bToID</a></li><li data-type='method'><a href="Drawable.html#.color4fFromID">color4fFromID</a></li><li data-type='method'><a href="Drawable.html#_calculateTransform">_calculateTransform</a></li><li data-type='method'><a href="Drawable.html#_skinWasAltered">_skinWasAltered</a></li><li data-type='method'><a href="Drawable.html#dispose">dispose</a></li><li data-type='method'><a href="Drawable.html#getAABB">getAABB</a></li><li data-type='method'><a href="Drawable.html#getBounds">getBounds</a></li><li data-type='method'><a href="Drawable.html#getEnabledEffects">getEnabledEffects</a></li><li data-type='method'><a href="Drawable.html#getFastBounds">getFastBounds</a></li><li data-type='method'><a href="Drawable.html#getUniforms">getUniforms</a></li><li data-type='method'><a href="Drawable.html#getVisible">getVisible</a></li><li data-type='method'><a href="Drawable.html#needsConvexHullPoints">needsConvexHullPoints</a></li><li data-type='method'><a href="Drawable.html#setConvexHullDirty">setConvexHullDirty</a></li><li data-type='method'><a href="Drawable.html#setConvexHullPoints">setConvexHullPoints</a></li><li data-type='method'><a href="Drawable.html#setTransformDirty">setTransformDirty</a></li><li data-type='method'><a href="Drawable.html#updateProperties">updateProperties</a></li></ul></li><li><a href="PenSkin.html">PenSkin</a><ul class='methods'><li data-type='method'><a href="PenSkin.html#_setAttributes">_setAttributes</a></li><li data-type='method'><a href="PenSkin.html#_setCanvasSize">_setCanvasSize</a></li><li data-type='method'><a href="PenSkin.html#calculateRotationCenter">calculateRotationCenter</a></li><li data-type='method'><a href="PenSkin.html#clear">clear</a></li><li data-type='method'><a href="PenSkin.html#dispose">dispose</a></li><li data-type='method'><a href="PenSkin.html#drawLine">drawLine</a></li><li data-type='method'><a href="PenSkin.html#drawPoint">drawPoint</a></li><li data-type='method'><a href="PenSkin.html#drawStamp">drawStamp</a></li><li data-type='method'><a href="PenSkin.html#getTexture">getTexture</a></li><li data-type='method'><a href="PenSkin.html#getUniforms">getUniforms</a></li><li data-type='method'><a href="PenSkin.html#onNativeSizeChanged">onNativeSizeChanged</a></li><li data-type='method'><a href="PenSkin.html#setRotationCenter">setRotationCenter</a></li></ul></li><li><a href="Rectangle.html">Rectangle</a><ul class='methods'><li data-type='method'><a href="Rectangle.html#clamp">clamp</a></li><li data-type='method'><a href="Rectangle.html#contains">contains</a></li><li data-type='method'><a href="Rectangle.html#initFromBounds">initFromBounds</a></li><li data-type='method'><a href="Rectangle.html#initFromPointsAABB">initFromPointsAABB</a></li><li data-type='method'><a href="Rectangle.html#intersects">intersects</a></li><li data-type='method'><a href="Rectangle.html#snapToInt">snapToInt</a></li></ul></li><li><a href="RenderWebGL.html">RenderWebGL</a><ul class='methods'><li data-type='method'><a href="RenderWebGL.html#_createGeometry">_createGeometry</a></li><li data-type='method'><a href="RenderWebGL.html#_drawThese">_drawThese</a></li><li data-type='method'><a href="RenderWebGL.html#_filterCandidatesTouching">_filterCandidatesTouching</a></li><li data-type='method'><a href="RenderWebGL.html#_getConvexHullPointsForDrawable">_getConvexHullPointsForDrawable</a></li><li data-type='method'><a href="RenderWebGL.html#_setNativeSize">_setNativeSize</a></li><li data-type='method'><a href="RenderWebGL.html#_touchingBounds">_touchingBounds</a></li><li data-type='method'><a href="RenderWebGL.html#createBitmapSkin">createBitmapSkin</a></li><li data-type='method'><a href="RenderWebGL.html#createDrawable">createDrawable</a></li><li data-type='method'><a href="RenderWebGL.html#createPenSkin">createPenSkin</a></li><li data-type='method'><a href="RenderWebGL.html#createSVGSkin">createSVGSkin</a></li><li data-type='method'><a href="RenderWebGL.html#destroyDrawable">destroyDrawable</a></li><li data-type='method'><a href="RenderWebGL.html#destroySkin">destroySkin</a></li><li data-type='method'><a href="RenderWebGL.html#draw">draw</a></li><li data-type='method'><a href="RenderWebGL.html#extractDrawable">extractDrawable</a></li><li data-type='method'><a href="RenderWebGL.html#getBounds">getBounds</a></li><li data-type='method'><a href="RenderWebGL.html#getFencedPositionOfDrawable">getFencedPositionOfDrawable</a></li><li data-type='method'><a href="RenderWebGL.html#getNativeSize">getNativeSize</a></li><li data-type='method'><a href="RenderWebGL.html#getSkinSize">getSkinSize</a></li><li data-type='method'><a href="RenderWebGL.html#isTouchingColor">isTouchingColor</a></li><li data-type='method'><a href="RenderWebGL.html#isTouchingDrawables">isTouchingDrawables</a></li><li data-type='method'><a href="RenderWebGL.html#onNativeSizeChanged">onNativeSizeChanged</a></li><li data-type='method'><a href="RenderWebGL.html#penClear">penClear</a></li><li data-type='method'><a href="RenderWebGL.html#penLine">penLine</a></li><li data-type='method'><a href="RenderWebGL.html#penPoint">penPoint</a></li><li data-type='method'><a href="RenderWebGL.html#penStamp">penStamp</a></li><li data-type='method'><a href="RenderWebGL.html#pick">pick</a></li><li data-type='method'><a href="RenderWebGL.html#resize">resize</a></li><li data-type='method'><a href="RenderWebGL.html#setBackgroundColor">setBackgroundColor</a></li><li data-type='method'><a href="RenderWebGL.html#setDebugCanvas">setDebugCanvas</a></li><li data-type='method'><a href="RenderWebGL.html#setDrawableOrder">setDrawableOrder</a></li><li data-type='method'><a href="RenderWebGL.html#setStageSize">setStageSize</a></li><li data-type='method'><a href="RenderWebGL.html#updateDrawableProperties">updateDrawableProperties</a></li></ul></li><li><a href="ShaderManager.html">ShaderManager</a><ul class='methods'><li data-type='method'><a href="ShaderManager.html#_buildShader">_buildShader</a></li><li data-type='method'><a href="ShaderManager.html#getShader">getShader</a></li></ul></li><li><a href="Skin.html">Skin</a><ul class='methods'><li data-type='method'><a href="Skin.html#calculateRotationCenter">calculateRotationCenter</a></li><li data-type='method'><a href="Skin.html#dispose">dispose</a></li><li data-type='method'><a href="Skin.html#getTexture">getTexture</a></li><li data-type='method'><a href="Skin.html#getUniforms">getUniforms</a></li><li data-type='method'><a href="Skin.html#setRotationCenter">setRotationCenter</a></li></ul></li><li><a href="SvgRenderer.html">SvgRenderer</a><ul class='methods'><li data-type='method'><a href="SvgRenderer.html#_createSVGElement">_createSVGElement</a></li><li data-type='method'><a href="SvgRenderer.html#_draw">_draw</a></li><li data-type='method'><a href="SvgRenderer.html#_toString">_toString</a></li><li data-type='method'><a href="SvgRenderer.html#_transformMeasurements">_transformMeasurements</a></li><li data-type='method'><a href="SvgRenderer.html#_transformText">_transformText</a></li><li data-type='method'><a href="SvgRenderer.html#fromString">fromString</a></li><li data-type='method'><a href="SvgRenderer.html#getDrawRatio">getDrawRatio</a></li></ul></li><li><a href="SVGSkin.html">SVGSkin</a><ul class='methods'><li data-type='method'><a href="SVGSkin.html#calculateRotationCenter">calculateRotationCenter</a></li><li data-type='method'><a href="SVGSkin.html#dispose">dispose</a></li><li data-type='method'><a href="SVGSkin.html#getTexture">getTexture</a></li><li data-type='method'><a href="SVGSkin.html#getUniforms">getUniforms</a></li><li data-type='method'><a href="SVGSkin.html#setRotationCenter">setRotationCenter</a></li><li data-type='method'><a href="SVGSkin.html#setSVG">setSVG</a></li></ul></li></ul><h3>Modules</h3><ul><li><a href="module-RenderConstants.html">RenderConstants</a></li></ul><h3>Events</h3><ul><li><a href="RenderWebGL.html#event:event:NativeSizeChanged">event:NativeSizeChanged</a></li><li><a href="Skin.html#.event:event:WasAltered">event:WasAltered</a></li></ul><h3>Global</h3><ul><li><a href="global.html#FENCE_WIDTH">FENCE_WIDTH</a></li></ul>
|
|
</nav>
|
|
|
|
<div id="main">
|
|
|
|
<h1 class="page-title">SvgRenderer</h1>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<section>
|
|
|
|
<header>
|
|
|
|
<h2>
|
|
SvgRenderer
|
|
</h2>
|
|
|
|
<div class="class-description"><p>Main quirks-mode SVG rendering code.</p></div>
|
|
|
|
|
|
</header>
|
|
|
|
<article>
|
|
<div class="container-overview">
|
|
|
|
|
|
|
|
|
|
<h2>Constructor</h2>
|
|
|
|
|
|
<h4 class="name" id="SvgRenderer"><span class="type-signature"></span>new SvgRenderer<span class="signature">(canvas<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="description">
|
|
<p>Create a quirks-mode SVG renderer for a particular canvas.</p>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h5>Parameters:</h5>
|
|
|
|
|
|
<table class="params">
|
|
<thead>
|
|
<tr>
|
|
|
|
<th>Name</th>
|
|
|
|
|
|
<th>Type</th>
|
|
|
|
|
|
<th>Attributes</th>
|
|
|
|
|
|
|
|
|
|
<th class="last">Description</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
|
|
|
|
<tr>
|
|
|
|
<td class="name"><code>canvas</code></td>
|
|
|
|
|
|
<td class="type">
|
|
|
|
|
|
<span class="param-type">HTMLCanvasElement</span>
|
|
|
|
|
|
|
|
</td>
|
|
|
|
|
|
<td class="attributes">
|
|
|
|
<optional><br>
|
|
|
|
|
|
|
|
|
|
|
|
</td>
|
|
|
|
|
|
|
|
|
|
<td class="description last"><p>An optional canvas element to draw to. If this is not provided, the renderer
|
|
will create a new canvas.</p></td>
|
|
</tr>
|
|
|
|
|
|
</tbody>
|
|
</table>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h3 class="subsection-title">Members</h3>
|
|
|
|
|
|
|
|
<h4 class="name" id="canvas"><span class="type-signature"></span>canvas<span class="type-signature"></span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h4 class="name" id="size"><span class="type-signature"></span>size<span class="type-signature"></span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h4 class="name" id="viewOffset"><span class="type-signature"></span>viewOffset<span class="type-signature"></span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h3 class="subsection-title">Methods</h3>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h4 class="name" id="_createSVGElement"><span class="type-signature"></span>_createSVGElement<span class="signature">(tagName)</span><span class="type-signature"> → (non-null) {DOMElement}</span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="description">
|
|
<p>Helper to create an SVG element with the correct NS.</p>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h5>Parameters:</h5>
|
|
|
|
|
|
<table class="params">
|
|
<thead>
|
|
<tr>
|
|
|
|
<th>Name</th>
|
|
|
|
|
|
<th>Type</th>
|
|
|
|
|
|
|
|
|
|
|
|
<th class="last">Description</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
|
|
|
|
<tr>
|
|
|
|
<td class="name"><code>tagName</code></td>
|
|
|
|
|
|
<td class="type">
|
|
|
|
|
|
<span class="param-type">string</span>
|
|
|
|
|
|
|
|
</td>
|
|
|
|
|
|
|
|
|
|
|
|
<td class="description last"><p>Tag name for the element.</p></td>
|
|
</tr>
|
|
|
|
|
|
</tbody>
|
|
</table>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h5>Returns:</h5>
|
|
|
|
|
|
<div class="param-desc">
|
|
<p>Element created.</p>
|
|
</div>
|
|
|
|
|
|
|
|
<dl class="param-type">
|
|
<dt>
|
|
Type
|
|
</dt>
|
|
<dd>
|
|
|
|
<span class="param-type">DOMElement</span>
|
|
|
|
|
|
</dd>
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h4 class="name" id="_draw"><span class="type-signature"></span>_draw<span class="signature">()</span><span class="type-signature"></span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="description">
|
|
<p>Draw the SVG to a canvas.</p>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h4 class="name" id="_toString"><span class="type-signature"></span>_toString<span class="signature">()</span><span class="type-signature"> → {string}</span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="description">
|
|
<p>Serialize the active SVG DOM to a string.</p>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h5>Returns:</h5>
|
|
|
|
|
|
<div class="param-desc">
|
|
<p>String representing current SVG data.</p>
|
|
</div>
|
|
|
|
|
|
|
|
<dl class="param-type">
|
|
<dt>
|
|
Type
|
|
</dt>
|
|
<dd>
|
|
|
|
<span class="param-type">string</span>
|
|
|
|
|
|
</dd>
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h4 class="name" id="_transformMeasurements"><span class="type-signature"></span>_transformMeasurements<span class="signature">()</span><span class="type-signature"></span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="description">
|
|
<p>Transform the measurements of the SVG.
|
|
In Scratch 2.0, SVGs are drawn without respect to the width,
|
|
height, and viewBox attribute on the tag. The exporter
|
|
does output these properties - but they appear to be incorrect often.
|
|
To address the incorrect measurements, we append the DOM to the
|
|
document, and then use SVG's native <code>getBBox</code> to find the real
|
|
drawn dimensions. This ensures things drawn in negative dimensions,
|
|
outside the given viewBox, etc., are all eventually drawn to the canvas.
|
|
I tried to do this several other ways: stripping the width/height/viewBox
|
|
attributes and then drawing (Firefox won't draw anything),
|
|
or inflating them and then measuring a canvas. But this seems to be
|
|
a natural and performant way.</p>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h4 class="name" id="_transformText"><span class="type-signature"></span>_transformText<span class="signature">()</span><span class="type-signature"></span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="description">
|
|
<p>Transforms an SVG's text elements for Scratch 2.0 quirks.
|
|
These quirks include:</p>
|
|
<ol>
|
|
<li><code>x</code> and <code>y</code> properties are removed/ignored.</li>
|
|
<li>Alignment is set to <code>text-before-edge</code>.</li>
|
|
<li>Line-breaks are converted to explicit <tspan> elements.</li>
|
|
<li>Any required fonts are injected.</li>
|
|
</ol>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h4 class="name" id="fromString"><span class="type-signature"></span>fromString<span class="signature">(svgString, onFinish<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="description">
|
|
<p>Load an SVG from a string and draw it.
|
|
This will be parsed and transformed, and finally drawn.
|
|
When drawing is finished, the <code>onFinish</code> callback is called.</p>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h5>Parameters:</h5>
|
|
|
|
|
|
<table class="params">
|
|
<thead>
|
|
<tr>
|
|
|
|
<th>Name</th>
|
|
|
|
|
|
<th>Type</th>
|
|
|
|
|
|
<th>Attributes</th>
|
|
|
|
|
|
|
|
|
|
<th class="last">Description</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
|
|
|
|
<tr>
|
|
|
|
<td class="name"><code>svgString</code></td>
|
|
|
|
|
|
<td class="type">
|
|
|
|
|
|
<span class="param-type">string</span>
|
|
|
|
|
|
|
|
</td>
|
|
|
|
|
|
<td class="attributes">
|
|
|
|
|
|
|
|
|
|
|
|
</td>
|
|
|
|
|
|
|
|
|
|
<td class="description last"><p>String of SVG data to draw in quirks-mode.</p></td>
|
|
</tr>
|
|
|
|
|
|
|
|
<tr>
|
|
|
|
<td class="name"><code>onFinish</code></td>
|
|
|
|
|
|
<td class="type">
|
|
|
|
|
|
<span class="param-type">function</span>
|
|
|
|
|
|
|
|
</td>
|
|
|
|
|
|
<td class="attributes">
|
|
|
|
<optional><br>
|
|
|
|
|
|
|
|
|
|
|
|
</td>
|
|
|
|
|
|
|
|
|
|
<td class="description last"><p>Optional callback for when drawing finished.</p></td>
|
|
</tr>
|
|
|
|
|
|
</tbody>
|
|
</table>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h4 class="name" id="getDrawRatio"><span class="type-signature"></span>getDrawRatio<span class="signature">()</span><span class="type-signature"> → {number}</span></h4>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<dl class="details">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="description">
|
|
<p>Get the drawing ratio, adjusted for HiDPI screens.</p>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h5>Returns:</h5>
|
|
|
|
|
|
<div class="param-desc">
|
|
<p>Scale ratio to draw to canvases with.</p>
|
|
</div>
|
|
|
|
|
|
|
|
<dl class="param-type">
|
|
<dt>
|
|
Type
|
|
</dt>
|
|
<dd>
|
|
|
|
<span class="param-type">number</span>
|
|
|
|
|
|
</dd>
|
|
</dl>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</article>
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<br class="clear">
|
|
|
|
<footer>
|
|
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.5.3</a> using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
|
|
</footer>
|
|
|
|
<script>prettyPrint();</script>
|
|
<script src="scripts/linenumber.js"></script>
|
|
</body>
|
|
</html> |