{"id":512,"date":"2010-05-03T07:50:19","date_gmt":"2010-05-03T14:50:19","guid":{"rendered":"https:\/\/actionsnippet.com\/?p=2916"},"modified":"2010-05-03T07:50:19","modified_gmt":"2010-05-03T14:50:19","slug":"3d-ring","status":"publish","type":"post","link":"https:\/\/actionsnippet.com\/?p=512","title":{"rendered":"3D Ring"},"content":{"rendered":"<pre class=\"brush: as3; title: ; notranslate\" title=\"\">\r\n&#x5B;SWF(width = 500, height=500)]\r\nvar ring:MovieClip = createRing();\r\nring.x = stage.stageWidth \/ 2;\r\nring.y = stage.stageHeight \/ 2;\r\naddChild(ring);\r\n\r\nfunction createRing(sectionNum:int = 30):MovieClip{\r\n\tvar container:MovieClip = new MovieClip();\r\n\tcontainer.circles = &#x5B;];\r\n\tcontainer.theta = 0;\r\n\tcontainer.thetaDest = 0;\r\n\tvar step:Number = (Math.PI * 2) \/ sectionNum;\r\n\tfor (var i:int = 0; i&lt;sectionNum; i++){\r\n\t\tvar c:MovieClip = new MovieClip();\r\n\t\twith (c.graphics){\r\n\t\t\tlineStyle(0,0x000000);\r\n\t\t\tbeginFill(0xCCCCCC);\r\n\t\t\tdrawCircle(0,0,20);\r\n\t\t}\r\n\t\tc.thetaOffset = step * i;\r\n\t\tcontainer.addChild(c);\r\n\t\tcontainer.circles.push(c);\r\n\t}\r\n\tcontainer.addEventListener(Event.ENTER_FRAME, onRun);\r\n\treturn container;\r\n}\r\nfunction onRun(evt:Event):void {\r\n\tvar container:MovieClip = MovieClip(evt.currentTarget);\r\n\tvar num:int = container.circles.length;\r\n\tfor (var i:int = 0; i&lt;num; i++){\r\n\t\tvar c:MovieClip = container.circles&#x5B;i];\r\n\t\tvar angle:Number = container.theta + c.thetaOffset;\r\n\t\tc.x = 200 * Math.cos(angle);\r\n\t\tc.y = 100 * Math.sin(angle);\r\n\t\tc.scaleX = (100 + c.y) \/ 120 + 0.2;\r\n\t\tc.scaleY = c.scaleX;\r\n\t}\r\n\tcontainer.circles.sortOn(&quot;y&quot;, Array.NUMERIC);\r\n\tfor (i = 0; i&lt;num; i++){\r\n\t\tcontainer.addChild(container.circles&#x5B;i]);\r\n\t}\r\n\tif (container.mouseX &lt; -100){\r\n\t\tcontainer.thetaDest -= 0.05;\r\n\t}\r\n\tif (container.mouseX &gt; 100){\r\n\t\tcontainer.thetaDest += 0.05;\r\n\t}\r\n\tcontainer.theta += (container.thetaDest  - container.theta) \/ 12;\r\n\t\r\n}\r\n<\/pre>\n<p>This snippet shows how to create a 3D ring navigation using sine and cosine. Have a look:<\/p>\n<div style=\"text-align:center;width:465px;\"><iframe loading=\"lazy\" title=\"Ring - wonderfl build flash online\" scrolling=\"no\" src=\"http:\/\/wonderfl.net\/blogparts\/9e8B\" width=\"465\" height=\"490\" style=\"border:1px black solid;\"><\/iframe><a href=\"http:\/\/wonderfl.net\/c\/9e8B\" title=\"Ring - wonderfl build flash online\">Ring &#8211; wonderfl build flash online<\/a><\/div>\n","protected":false},"excerpt":{"rendered":"<p>&#x5B;SWF(width = 500, height=500)] var ring:MovieClip = createRing(); ring.x = stage.stageWidth \/ 2; ring.y = stage.stageHeight \/ 2; addChild(ring); function createRing(sectionNum:int = 30):MovieClip{ var container:MovieClip = new MovieClip(); container.circles = &#x5B;]; container.theta = 0; container.thetaDest = 0; var step:Number = (Math.PI * 2) \/ sectionNum; for (var i:int = 0; i&lt;sectionNum; i++){ var c:MovieClip = [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[101,19,33,13,22,47,98],"tags":[3,14,4],"class_list":["post-512","post","type-post","status-publish","format-standard","hentry","category-3d","category-arrays","category-graphics","category-motion","category-movieclip","category-sorton","category-ui","tag-actionscript","tag-as3","tag-flash"],"_links":{"self":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/512","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=512"}],"version-history":[{"count":0,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/512\/revisions"}],"wp:attachment":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=512"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=512"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=512"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}