{"id":342,"date":"2009-07-11T05:10:09","date_gmt":"2009-07-11T12:10:09","guid":{"rendered":"https:\/\/actionsnippet.com\/?p=1743"},"modified":"2009-07-11T05:10:09","modified_gmt":"2009-07-11T12:10:09","slug":"drawtriangles-2d-textured-plane","status":"publish","type":"post","link":"https:\/\/actionsnippet.com\/?p=342","title":{"rendered":"drawTriangles() 2D Textured Plane"},"content":{"rendered":"<pre class=\"brush: as3; title: ; notranslate\" title=\"\">\r\n&#x5B;SWF(width = 700, height = 700)]\r\n\r\nvar loader:Loader = new Loader();\r\nloader.load(new URLRequest(&quot;https:\/\/actionsnippet.com\/wp-content\/chair.jpg&quot;));\r\nloader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoaded);\r\nvar tex:BitmapData;\r\nfunction onLoaded(evt:Event):void{\r\n\ttex = Bitmap(loader.content).bitmapData;\r\n\taddEventListener(Event.ENTER_FRAME, onLoop);\r\n}\r\n\r\nvar plane:Shape = Shape(addChild(new Shape()));\r\nplane.x = plane.y = 50;\r\n\r\nvar verts:Vector.&lt;Number&gt; = new Vector.&lt;Number&gt;();\r\nvar uvs:Vector.&lt;Number&gt; = new Vector.&lt;Number&gt;();\r\nvar indices:Vector.&lt;int&gt; = new Vector.&lt;int&gt;();\r\nvar rows:int = 30;\r\nvar size:Number = rows + 1;\r\nvar vertNum:Number = size * size;\r\nvar polySize:Number = 20;\r\nvar vIndex:int = 0;\r\nvar uvIndex:int = 0;\r\nvar gridSize:Number = rows * polySize;\r\nfor (var i:Number = 0; i&lt;vertNum; i++){\r\n\tvar xp:Number = i % size * polySize;\r\n\tvar yp:Number =  int(i \/ size) * polySize;\r\n\tverts&#x5B;vIndex++] = xp\r\n\tverts&#x5B;vIndex++] = yp;\r\n\tuvs&#x5B;uvIndex++] = xp \/ gridSize;\r\n\tuvs&#x5B;uvIndex++] = yp \/ gridSize;\r\n\tif (i % size != rows){\r\n\t\t  indices.push(i, i+1, i+size, i+size, i+size+1, i+1);\r\n\t}\r\n}\r\n\r\n\/\/ render and show that the verts can be changed around\r\nfunction onLoop(evt:Event):void {\r\n\t\/\/ shake the verts\r\n\tfor (var i:int = 0; i&lt;verts.length; i++){\r\n\t\tverts&#x5B;i] += Math.random() - 0.5;\r\n\t}\r\n\twith(plane.graphics){\r\n\t\tclear();\r\n\t\tbeginBitmapFill(tex,null, false, true);\r\n\t\tdrawTriangles(verts, indices,uvs);\r\n\t}\r\n}\r\n<\/pre>\n<p>This snippet is shows how to draw a textured 2D plane using drawTriangles(). This is similar to the wireframe 2D plane post <a href=\"https:\/\/actionsnippet.com\/?p=1734\" target=\"blank\">from yesterday<\/a>&#8230; the main difference is that you need to calculate UV coordinates if you want to use a bitmap fill with drawTriangles().<\/p>\n<p>Here is a still of this snippet:<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/actionsnippet.com\/wp-content\/chair_tex.jpg\" \/><\/p>\n","protected":false},"excerpt":{"rendered":"<p>&#x5B;SWF(width = 700, height = 700)] var loader:Loader = new Loader(); loader.load(new URLRequest(&quot;https:\/\/actionsnippet.com\/wp-content\/chair.jpg&quot;)); loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoaded); var tex:BitmapData; function onLoaded(evt:Event):void{ tex = Bitmap(loader.content).bitmapData; addEventListener(Event.ENTER_FRAME, onLoop); } var plane:Shape = Shape(addChild(new Shape())); plane.x = plane.y = 50; var verts:Vector.&lt;Number&gt; = new Vector.&lt;Number&gt;(); var uvs:Vector.&lt;Number&gt; = new Vector.&lt;Number&gt;(); var indices:Vector.&lt;int&gt; = new Vector.&lt;int&gt;(); var rows:int = 30; var [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[24,33,79],"tags":[3,14,4],"class_list":["post-342","post","type-post","status-publish","format-standard","hentry","category-bitmapdata","category-graphics","category-vector","tag-actionscript","tag-as3","tag-flash"],"_links":{"self":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/342","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=342"}],"version-history":[{"count":0,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/342\/revisions"}],"wp:attachment":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=342"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=342"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=342"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}