Wedge鏈€杩戣鍋氫竴涓熀绔欑珯鐐圭殑鍙鍖栨紨绀洪」鐩€傛垜浠厛灏濊瘯浜?D鍙鍖栨妧鏈潵缂栫▼锛屼絾鏄鎴峰弽棣堜粬浠殑瀹㈡埛绔數鑴戞瘮杈冨樊锛屾€ц兘鍜屾晥鐜囦細寰堝樊锛屾湁鐨勭敋鑷充娇鐢ㄤ簯涓绘満銆傚洜姝わ紝鎴戜滑鍏堝仛浜嗕竴涓€ц兘姣旇緝鏋佽嚧鐨?Ddemo锛屽涓嬪浘鎵€绀猴細涓轰簡灏藉彲鑳藉仛鍒版渶濂界殑鎬ц兘锛屾垜浠兂浜嗗悇绉嶆€ц兘浼樺寲鐨勬柟娉曘€傚綋鐒讹紝鏁堟灉涓婁細鏈夋姌鎵ｃ€備笌鎴戜滑鑷繁鐨勪竴浜涗骇鍝佹瘮濡?D鏈烘埧鐩告瘮锛岃繖涓猟emo鐨勬晥鏋滆偗瀹氭湁寰堝ぇ鐨勫樊璺濄€備笉杩囷紝鎬ц兘杩樻槸寰堜笉閿欑殑銆傜劧鑰岋紝涓嶅垢鐨勬槸锛屽鎴锋嬁鍒癲emo娴嬭瘯鍚庡苟涓嶆弧鎰忋€傘€傘€傛€ц兘杩樺彲浠ワ紝灏辨槸瑙夊緱鏁堟灉涓嶅閰枫€傞厤缃緢浣庯紝浣嗕篃闇€瑕侀珮鎬ц兘鍜岀偒鐩殑鏁堟灉銆傝繖鍙兘褰掔粨涓轰竴鍙ヨ瘽锛氱湅浼艰韩澶勭粷澧冣€︹€︾劧鑰岋紝姝婚噷閫冪敓锛屽線寰€鏈夋柊鐨勫笇鏈涳紝鏂扮殑鏈轰細銆?.5D鐨勬€濇兂鐏姳绐佺劧鎯冲埌浜?.5D锛岃繖鏄竴绉嶄吉3D鏁堟灉锛屼絾鏄彧鑳戒綋鐜颁竴涓憚鍍忔満瑙掑害鐨勬樉绀烘晥鏋滐紝鏃犳硶瀹炵幇闀滃ご鐨勬棆杞晥鏋溿€傚叾瀹炲緢鏃╃殑鏃跺€欙紝鎴戜滑灏辨湁涓€浜?.5D鐨勫師鍨嬶紝姣斿灞傜骇鎷撴墤鍥撅紝2.5D鐨勮妭鐐广€傚眰娆℃嫇鎵戝浘鐢氳嚦鍙互杩芥函鍒癑ava鏃朵唬銆傚涓嬪浘鎵€绀猴細鎶婁箣鍓嶇殑2.5D婧愮爜鎷垮嚭鏉ュ啀璇讳竴閬嶃€傜湅瀹屽ぇ鎰忥細涓昏鏄€氳繃涓変釜骞宠鍥涜竟褰㈡嫾鎺ユ潵妯℃嫙杩欑3D鏁堟灉锛屾病鏈変粈涔堟妧鏈綋绯汇€傝繖绉嶆€濊矾瀵逛簬瀵硅薄鐨勫畾浣嶅拰瀵归綈浼氭瘮杈冨洶闅撅紝寮€鍙戞湰韬殑闅惧害涔熸瘮杈冨ぇ銆傚彟澶栵紝瑕佸彇寰椾竴浜涘ソ鐨勬晥鏋滀篃姣旇緝鍥伴毦銆傝鐭ラ亾瀹㈡埛瀵规晥鏋滅殑瑕佹眰涓嶄綆銆傛墍浠ワ紝瑕佹嬁鍑烘柊鐨勬妧鏈€濊矾锛屾渶濂芥槸绯荤粺鐨勬€濊矾锛屾妸浠ュ墠鐨勬妧鏈€濊矾鏀规帀銆傚綋鐒惰繖骞朵笉瀹规槗銆傚綋鏃讹紝鎴戞病鏈変粈涔堝ソ涓绘剰銆傛垜鏈夊緢澶氱枒闂拰鍥版儜銆備箣鍚庡緢澶氬ぉ閮芥槸杩欑鐘舵€併€備簨鎯呭湪涓€娆″嚭宸腑鍙戠敓浜嗚浆鏈恒€傛嫓璁夸竴涓ぇ瀹㈡埛鍥為厭搴楃殑璺笂锛岃蛋鍦ㄨ矾涓婏紝鑴戝瓙閲岀獊鐒跺啋鍑轰竴涓兂娉曪紝涓轰粈涔堜笉鐢?D鐨勬兂娉曞拰涓€浜涚畻娉曞憿锛?.5D涓嶅氨鏄?D鐨勬晥鏋滃悧锛熸墍璋?.5D锛岄【鍚嶆€濅箟锛屽氨鏄彇鍑犲嫼2D鎶€鏈紝鍐嶅彇鍑犲嫼3D鎶€鏈紝鏀惧湪閿呴噷涓€璧风倰锛屼綍蹇呭彧闄愪簬2D鎶€鏈?鏈汉鐮旂┒3D鎶€鏈骞达紝瀵?D鐩稿叧鎶€鏈潪甯哥簿閫氥€傞】鏃讹紝涓€鍒囦豢浣涢兘鎯抽€氫簡锛屼竴濂楃郴缁熺殑2.5D鎶€鏈紑濮嬪湪鎴戝績涓敓鏍广€佸彂鑺姐€佺敓闀裤€傛垜蹇冮噷寰堥珮鍏淬€傦紙浣嗚〃闈㈠緢骞抽潤锛夎繖浠朵簨鍛婅瘔鎴戜滑涓€涓亾鐞嗭紝涓嶆噦闂灏变笉瑕佸浐鎵э紝澶氬嚭鍘昏蛋璧帮紝璇翠笉瀹氬氨浼氭兂閫氫簡銆傪煒勬帴涓嬫潵鑷俊婊℃弧鐨勫拰瀹㈡埛娌熼€氾紝寮€濮嬫墜鍐欑浉鍏崇殑鎶€鏈獙璇乨emo锛屽叾涓秹鍙婂埌涓€浜涙妧鏈紝鍚庨潰浼氳瑙ｃ€俤emo缁堜簬寰楀埌浜嗗鎴风殑璁ゅ彲锛屾垜浠粓浜庢嬁涓嬩簡杩欎釜椤圭洰銆傝€屾垜鍛紝鍒涢€犱簡涓€濂?.5D鐩稿叧鐨勬妧鏈綋绯伙紝涔熺畻鏄皬鏈夋垚灏变簡銆傝繖鏄竴绉嶅垱閫狅紝鑰屽垱閫犳槸涓€浠跺揩涔愮殑浜嬫儏銆?.5D鎶€鏈杩版墍璋?.5D灏辨槸閫氳繃2D娓叉煋鎶€鏈揪鍒?D娓叉煋鏁堟灉銆傚叾涓繀鐒惰鐢ㄥ埌3D鎶€鏈殑涓€閮ㄥ垎锛氫笁缁寸┖闂村畾涔夋ā鍨嬬殑瀹氫箟锛堜娇鐢ㄤ笁缁寸┖闂村潗鏍囨潵瀹氫箟妯″瀷锛夋姇褰辩畻娉曞皢涓夌淮绌洪棿涓殑鍧愭爣鐐硅繘琛岃浆鎹㈢┖闂撮€氳繃鎶曞奖绠楁硶杞寲涓轰簩缁寸┖闂寸殑鍧愭爣銆備笁缁寸┖闂寸殑瀹氫箟涓轰簡杈惧埌2.5D鐨勬晥鏋滐紝鎴戜滑闇€瑕佸皢鍘熸潵鐨勪簩缁寸┖闂存墿灞曞埌涓夌淮绌洪棿銆備笁缁寸┖闂翠腑鏈塜銆乊銆乑涓変釜鍧愭爣杞达紝姣斿師鏉ョ殑浜岀淮绌洪棿澶氫簡涓€涓猌鍧愭爣杞淬€傚綋鐒?D绌洪棿鐨勫畾涔夋槸涓轰簡妯″瀷瀹氫箟銆佹ā鍨嬩綅缃畾浣嶄互鍙婂悗缁殑鎶曞奖绠楁硶銆傛渶鍚庣殑缁樺埗杩樻槸浼氬洖鍒颁簩缁寸┖闂淬€傛ā鍨嬫槸鍦ㄧ湡瀹?D涓畾涔夌殑锛岄渶瑕侀€氳繃obj绛夋ā鍨嬫枃浠舵潵瀹氫箟妯″瀷銆傚湪2.5D涓紝鍙渶瑕佸畾涔変竴涓珛鏂逛綋妯″瀷銆傚墠闈㈣浜嗭紝2.5D鍙憟鐜颁笁缁寸墿浣撴煇涓搴︾殑涓€涓〃闈紝鎵€浠ュ畠鐨勬ā鍨嬪彧闇€瑕佷竴寮犺繖涓〃闈㈢殑鍥剧墖锛屽浘鐗囧氨鏄ā鍨嬨€傚畾涔夌珛鏂逛綋妯″瀷鐨勫師鍥犳槸涓轰簡灏嗗浘鐗囨斁缃湪姝ｇ‘鐨勪綅缃苟绾︽潫姝ｇ‘鐨勫ぇ灏忓拰绾垫í姣斻€傝繖瀵规ā鍨嬫斁缃拰瀵归綈鍏锋湁閲嶈鎰忎箟銆傝繖閲岀殑绔嬫柟浣撶被浼间簬鐪熷疄妯″瀷鐨勫寘鍥翠綋銆傚彲浠ラ€氳繃鎸囧畾瀹藉害銆侀珮搴﹀拰娣卞害绛夊睘鎬ф潵瀹氫箟绔嬫柟浣撱€傚畾涔夋姇褰辩畻娉曪紝棣栧厛瑕佹ā鎷熶竴涓钩琛岄€忛暅锛岄€氳繃骞宠閫忛暅瀹氫箟閫忛暅鐨勪綅缃€佽搴︾瓑锛岄€氳繃杩欎簺鍙傛暟瀹氫箟涓€涓姇褰辩煩闃碉細/***璁＄畻鍙樻崲鐭╅樀锛屽嵆鐢遍暅澶村弬鏁板喅瀹?/calMVMatrix:function(){varangle=this.getAngle3(),vAngle=this.getVAngle3(),radius=this.getRadius3(),viewMatrix=mat4.create(),projectMatrix=mat4.鍒涘缓(),mvMatrix=mat4.create(),winWidth=1,winHeight=1;mat4.lookAt(viewMatrix,[radius*Math.cos(vAngle)*Math.sin(angle),-radius*Math.sin(vAngle),radius*Math.cos(vAngle)*Math.cos(angle),],[0,0,0],[0,1,0]);mat4.ortho(projectMatrix,-winWidth/2,winWidth/2,-winHeight/2,winHeight/2,0.1,1000);mat4.multiply(mvMatrix,projectMatrix,viewMatrix);this.mvMatrix=mvMatrix;}锛屽湪涓婇潰鐨勪唬鐮佷腑锛屼娇鐢ㄤ簡gl-matrix.js鍖呮潵瀹氫箟鎶曞奖鐭╅樀銆傚畾涔夊ソ鎶曞奖鐭╅樀鍚庯紝鍙互閫氳繃鎶曞奖绠楁硶璁＄畻鍑虹珛鏂逛綋鍚勪釜椤剁偣鍦ㄥ钩闈㈠潗鏍囦笂鐨勪綅缃細/***Layout锛屽墠鍥涗釜鐐筽1-p4锛屽悗鍥涗釜鐐筽5-p8**p8p7**p5p6**p4p3**p1p2**/varpoints1=[{x:-w3/2+pos.x,y:-h3/2+pos.y,z:d3/2+pos.z,},//p1{x:w3/2+pos.x,y:-h3/2+pos.y,z:d3/2+pos.z,},//p2{x:w3/2+pos.x,y:h3/2+pos.y,z:d3/2+pos.z,},//p3{x:-w3/2+pos.x,y:h3/2+pos.y,z:d3/2+pos.z,},//p4{x:-w3/2+pos.x,y:-h3/2+pos.y,z:-d3/2+pos.z,},//p5{x:w3/2+pos.x,y:-h3/2+pos.y,z:-d3/2+pos.z,},//p6{x:w3/2+pos.x,y:h3/2+pos.y,z:-d3/2+pos.z,},//p7{x:-w3/2+pos.x,y:h3/2+pos.y,z:-d3/2+pos.z,},//p8];varpoints=(this._points=[]);points1.forEach(function(point){varnewPoint=self.getPositionByRotate(point,pos,rotationX,rotationY,rotationZ);points.push({x:newPoint[0],y:newPoint[1],z:newPoint[2],});});varps=(this._projectPoints=points.map(function(point){returnself.getProjectionPoint(point);}));鏈変簡8涓《鐐规姇褰辩偣鍚庯紝鍙互鐢诲嚭杈规鏁堟灉鍜岄鑹插～鍏呮晥鏋滐紝涔熷彲浠ョ敾鍑哄浘鐗囧～鍏呮晥鏋滐紝鐢诲嚭杈规鏁堟灉锛屾妸鍑犱釜闈㈢殑鐐规寜椤哄簭缁勭粐璧锋潵锛屼篃灏辨槸鍙互鐢诲嚭杈规鏁堟灉.浠ヤ笅浠ｇ爜鏄剧ず锛歞rawPoints:function(ctx,points,close,dash,fill,borderColor,image){if(!points||points.length==0){return;}ctx.beginPath();ctx.strokeStyle="榛戣壊";濡傛灉锛堣竟妗嗛鑹诧級{ctx.strokeStyle=borderColor;}ctx.lineWidth=1;ctx.fillStyle='rgb(102,204,255)';濡傛灉锛堢牬鎶樺彿锛墈ctx.setLineDash([4,4]);ctx.strokeStyle='rgba(0,0,0,0.5)';}else{ctx.setLineDash([1,0]);}ctx.moveTo(points[0].x,points[0].y);瀵逛簬(vari=1;i
