{"id":767,"date":"2011-05-17T08:27:53","date_gmt":"2011-05-17T12:27:53","guid":{"rendered":"http:\/\/www.searchenginegenie.com\/web-design-blog\/?p=767"},"modified":"2011-05-17T08:28:34","modified_gmt":"2011-05-17T12:28:34","slug":"rendering-of-3d-colorful-sphere-rotation-using-flash","status":"publish","type":"post","link":"https:\/\/www.searchenginegenie.com\/web-design-blog\/rendering-of-3d-colorful-sphere-rotation-using-flash\/","title":{"rendered":"Rendering of 3d colorful sphere rotation using Flash:"},"content":{"rendered":"

<\/embed><\/object><\/p>\n

Step-1: Open a new document in flash is about the size of 400 X 410.<\/span>
\n
\nStep-2:In layer-1 type the text which ever you want. Here I gave \u201cMove the Mouse over the surface\u00a0 to rotate the sphere\u201d.<\/span>
\n
\nStep-3:Create layer-2 and write the following action script in keyframe-1(F9).
\n<\/span>
\nvar boardSize:Number=350;
\nvar cubeSize:Number=Math.round(boardSize\/3);
\nvar rotateFactor:Number=1.2*320\/boardSize;
\nvar fLen:Number=2000;
\nvar spBoard:Sprite=new Sprite();
\nthis.addChild(spBoard);
\nspBoard.x=200;
\nspBoard.y=200;
\nvar shBack:Shape=new Shape();
\nspBoard.addChild(shBack);
\ndrawBack();
\nvar shCube:Shape=new Shape();
\nspBoard.addChild(shCube);
\nvar doRotate:Boolean = false;
\nvar prevX:Number;
\nvar prevY:Number;
\nvar curTheta:Number=-10;
\nvar curPhi:Number=60;
\nvar examplesTot:uint=11;
\nvar exampleNum:uint=3;
\nvar nMesh:Number=40;
\nvar tilesArray:Array=[];
\nvar firstRun:Boolean=true;
\nvar tilesColors:Array=[];
\nfunction drawBack():void {
\nshBack.graphics.lineStyle(2,0xFFFFFF);
\nshBack.graphics.beginFill(0x000000);
\nshBack.graphics.drawRect(-boardSize\/2,-boardSize\/2,boardSize,boardSize);
\nshBack.graphics.endFill();
\n}
\nsetTilesArray();
\nrenderView(curTheta,curPhi);
\nfunction setTilesArray():void {
\nvar i:int;
\nvar j:int;
\nvar istep:Number;
\nvar jstep:Number;
\nvar tmin:Number;
\nvar tmax:Number;
\nvar smin:Number;
\nvar smax:Number;
\nvar curt:Number;
\nvar curs:Number;
\nshCube.graphics.clear();
\ntilesArray=[];
\ntilesColors=[];
\nfirstRun=true;
\ncurTheta=-10;
\ncurPhi=90;
\nif(exampleNum==3){
\ntmin=0;
\ntmax=1.5*Math.PI;
\nsmin=0;
\nsmax=2*Math.PI;
\n}
\nistep=(smax-smin)\/nMesh;
\njstep=(tmax-tmin)\/nMesh;
\nfor(i=0;i<=nMesh;i++){
\ncurs=istep*i+smin;
\ntilesArray[i]=[];
\nfor(j=0;j<=nMesh;j++){
\ncurt=jstep*j+tmin;
\nif(exampleNum==3){
\ntilesArray[i][j]=[cubeSize\/4.3*Math.cos(curs)*(2+Math.cos(curt)*2),cubeSize\/4.3*Math.sin(curs)*(2+Math.cos(curt)*2),cubeSize\/2.6*(3-curt)-0.3*cubeSize];
\n}
\n}
\n}
\n}
\nfunction renderView(t:Number,p:Number):void {
\nvar i:int;
\nvar j:int;
\nvar n:int;
\nvar distArray=[];
\nvar dispArray=[];
\nvar tilesNewArray=[];
\nvar midPoint:Array=[];
\nvar dist:Number;
\nvar depLen:Number;
\nvar coloFactor=100\/cubeSize;
\nt=t*Math.PI\/180;
\np=p*Math.PI\/90;
\nshCube.graphics.clear();
\nfor(i=0;i<=nMesh;i++){
\ntilesNewArray[i]=[];
\nfor(j=0;j<=nMesh;j++){
\ntilesNewArray[i][j]=pointNewView(tilesArray[i][j],t,p);
\n}
\n}
\nfor(i=0;i<nMesh;i++){
\nif(firstRun){
\ntilesColors[i]=[];
\n}
\nfor(j=0;j<nMesh;j++){
\nmidPoint[0]=(tilesNewArray[i][j][0]+tilesNewArray[i+1][j][0]+tilesNewArray[i][j+1][0]+tilesNewArray[i+1][j+1][0])\/4;
\nmidPoint[1]=(tilesNewArray[i][j][1]+tilesNewArray[i+1][j][1]+tilesNewArray[i][j+1][1]+tilesNewArray[i+1][j+1][1])\/4;
\nmidPoint[2]=(tilesNewArray[i][j][2]+tilesNewArray[i+1][j][2]+tilesNewArray[i][j+1][2]+tilesNewArray[i+1][j+1][2])\/4;
\ndist=Math.sqrt(Math.pow(fLen-midPoint[0],2)+Math.pow(midPoint[1],2)+Math.pow(midPoint[2],2));
\ndistArray.push([dist,i,j]);
\nif(firstRun){
\ntilesColors[i][j]=combineRGB((2*coloFactor*midPoint[2]+100)*0.8+70,(2*coloFactor*midPoint[1]+100)*0.8+70,(2*coloFactor*midPoint[0]+100)*0.8+70);
\n}
\n}
\n}
\ndistArray.sort(byDist);
\nfor(i=0;i<=nMesh;i++){
\ndispArray[i]=[];
\nfor(j=0;j<=nMesh;j++){
\ndispArray[i][j]=[fLen\/(fLen-tilesNewArray[i][j][0])*tilesNewArray[i][j][1],-fLen\/(fLen-tilesNewArray[i][j][0])*tilesNewArray[i][j][2]];
\n}
\n}
\ndepLen=distArray.length;
\nshCube.graphics.lineStyle(1,0×111111);
\nfor(n=0;n<depLen;n++){
\ni=distArray[n][1];
\nj=distArray[n][2];
\nshCube.graphics.moveTo(dispArray[i][j][0],dispArray[i][j][1]);
\nshCube.graphics.beginFill(tilesColors[i][j],1.0);
\nshCube.graphics.lineTo(dispArray[i][j+1][0],dispArray[i][j+1][1]);
\nshCube.graphics.lineTo(dispArray[i+1][j+1][0],dispArray[i+1][j+1][1]);
\nshCube.graphics.lineTo(dispArray[i+1][j][0],dispArray[i+1][j][1]);
\nshCube.graphics.lineTo(dispArray[i][j][0],dispArray[i][j][1]);
\nshCube.graphics.endFill();
\n}
\nfirstRun=false;
\n}
\nfunction byDist(v:Array,w:Array):Number {
\nif (v[0]>w[0]){
\nreturn -1;
\n} else if (v[0]<w[0]){
\nreturn 1;
\n} else {
\nreturn 0;
\n}
\n}
\nfunction pointNewView(v:Array,theta:Number,phi:Number):Array {
\nvar newCoords:Array=[];
\nnewCoords[0]=v[0]*Math.cos(theta)*Math.sin(phi)+v[1]*Math.sin(theta)*Math.sin(phi)+v[2]*Math.cos(phi);
\nnewCoords[1]=-v[0]*Math.sin(theta)+v[1]*Math.cos(theta);
\nnewCoords[2]=-v[0]*Math.cos(theta)*Math.cos(phi)-v[1]*Math.sin(theta)*Math.cos(phi)+v[2]*Math.sin(phi);
\nreturn newCoords;
\n}
\nfunction combineRGB(red:Number,green:Number,blue:Number):Number {
\nvar RGB:Number;
\nif(red>255){red=255;}
\nif(green>255){green=255;}
\nif(blue>255){blue=255;}
\nif(red<0){red=0;}
\nif(green<0){green=0;}
\nif(blue<0){blue=0;}
\nRGB=(red<<16) | (green<<8) | (blue<<0);
\nreturn RGB;
\n}
\nspBoard.addEventListener(MouseEvent.ROLL_OUT,boardOut);
\nspBoard.addEventListener(MouseEvent.MOUSE_MOVE,boardMove);
\nspBoard.addEventListener(MouseEvent.ROLL_OVER,boardOver);
\nfunction boardOut(e:MouseEvent):void {
\ndoRotate=false;
\n}
\nfunction boardOver(e:MouseEvent):void {
\nprevX=spBoard.mouseX;
\nprevY=spBoard.mouseY;
\ndoRotate=true;
\n}
\nfunction boardMove(e:MouseEvent):void {
\nvar locX:Number=prevX;
\nvar locY:Number=prevY;
\nif(doRotate){
\nprevX=spBoard.mouseX;
\nprevY=spBoard.mouseY;
\ncurTheta+=(prevX-locX)*rotateFactor;
\ncurPhi+=(prevY-locY)*rotateFactor;
\nrenderView(curTheta,curPhi);
\ne.updateAfterEvent();
\n}
\n}<\/span><\/p>\n

Now run the program.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"

Step-1: Open a new document in flash is about the size of 400 X 410. Step-2:In layer-1 type the text which ever you want. Here I gave \u201cMove the Mouse over the surface\u00a0 to rotate the sphere\u201d. Step-3:Create layer-2 and write the following action script in keyframe-1(F9). var boardSize:Number=350; var cubeSize:Number=Math.round(boardSize\/3); var rotateFactor:Number=1.2*320\/boardSize; var fLen:Number=2000; […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,6],"tags":[44,45],"class_list":["post-767","post","type-post","status-publish","format-standard","hentry","category-flash","category-web-design","tag-3d-rotating-sphere-using-flash","tag-3d-rotating-sphere-using-flash-action-script"],"_links":{"self":[{"href":"https:\/\/www.searchenginegenie.com\/web-design-blog\/wp-json\/wp\/v2\/posts\/767","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.searchenginegenie.com\/web-design-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.searchenginegenie.com\/web-design-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.searchenginegenie.com\/web-design-blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.searchenginegenie.com\/web-design-blog\/wp-json\/wp\/v2\/comments?post=767"}],"version-history":[{"count":12,"href":"https:\/\/www.searchenginegenie.com\/web-design-blog\/wp-json\/wp\/v2\/posts\/767\/revisions"}],"predecessor-version":[{"id":791,"href":"https:\/\/www.searchenginegenie.com\/web-design-blog\/wp-json\/wp\/v2\/posts\/767\/revisions\/791"}],"wp:attachment":[{"href":"https:\/\/www.searchenginegenie.com\/web-design-blog\/wp-json\/wp\/v2\/media?parent=767"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.searchenginegenie.com\/web-design-blog\/wp-json\/wp\/v2\/categories?post=767"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.searchenginegenie.com\/web-design-blog\/wp-json\/wp\/v2\/tags?post=767"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}