绠€浠嬪湪鍋氬睍绀洪」鐩殑鏃跺€欙紝閫氬父闇€瑕佸疄鐜颁竴浜涘渾褰㈢殑閫夊尯鏁堟灉銆傝繖鍙互鍦╟ssrotate鐨勫府鍔╀笅瀹炵幇銆備絾锛佸浣曞疄鐜板甫鍥剧墖鐨?D鏃嬭浆鐞冧綋锛熷紑濮嬪惂銆傞瑙堝湴鍧€馃敆宸ュ叿three.jsOrbitControlsdraw鍒涘缓鍦烘櫙瑕佺敤three.js鏄剧ず鍦烘櫙锛屾垜浠渶瑕佷互涓嬪璞★細scene銆乧amera鍜宺enderer锛岃繖鏍锋垜浠氨鍙互閫氳繃camera鏉ユ覆鏌撳満鏅€俵etcamera,scene,renderer;//scenecene=newTHREE.Scene();//cameracamera=newTHREE.PerspectiveCamera(10,window.innerWidth/window.innerHeight,0.1,200);camera.position.set(30,5,20);//rendererrenderer=newTHREE.WebGLRenderer();renderer.setPixelRatio(window.devicePixelRatio);renderer.setSize(window.innerWidth,window.innerHeight);document.body.appendChild(renderer.domElement);鑺辩偣鏃堕棿瑙ｉ噴涓€涓嬭繖閲屽彂鐢熶簡浠€涔堛€傛垜浠幇鍦ㄥ凡缁忚缃簡鍦烘櫙銆佺浉鏈哄拰娓叉煋鍣ㄣ€倀hree.js涓湁鍑犵鈥嬧€嬩笉鍚岀殑鐩告満锛岃繖閲岋紝鎴戜滑浣跨敤鐨勬槸PerspectiveCamera锛堥€忚鐩告満锛夈€傜涓€涓弬鏁版槸瑙嗛噹(FOV)銆傚彲瑙嗚搴︽槸鎮ㄩ殢鏃跺彲浠ュ湪鏄剧ず鍣ㄤ笂鐪嬪埌鐨勬櫙鐗╃殑鑼冨洿锛屾暟鍊艰秺澶э紝璺濈瓒婅繙銆傜浜屼釜鍙傛暟鏄旱妯瘮銆備篃灏辨槸璇达紝鎮ㄥ皢瀵硅薄鐨勫搴﹂櫎浠ュ叾楂樺害銆備緥濡傦紝褰撴偍鍦ㄥ灞忕數瑙嗕笂鎾斁鑰佺數褰辨椂锛屽浘鍍忓彲鑳戒細琚帇鎵併€傛帴涓嬫潵鐨勪袱涓弬鏁版槸杩戞锛坣ear锛夊拰杩滄锛坒ar锛夈€傚綋瀵硅薄鐨勬煇浜涢儴鍒嗘瘮鐩告満鐨勮繙閮ㄥ垎鏇磋繙鎴栨瘮杩戦儴鍒嗘洿杩戞椂锛岃繖浜涢儴鍒嗗皢涓嶄細娓叉煋鍒板満鏅腑銆備篃璁镐綘鐜板湪涓嶇敤鎷呭績杩欎釜鍊肩殑褰卞搷锛屼絾鏄互鍚庝负浜嗗緱鍒版洿濂界殑娓叉煋鎬ц兘锛屼綘鍙互鍦ㄤ綘鐨勫簲鐢ㄧ▼搴忎腑璁剧疆瀹冦€傛帴涓嬫潵鏄覆鏌撳櫒銆傝繖灏辨槸榄旀硶鍙戠敓鐨勫湴鏂广€傞櫎浜嗘垜浠繖閲屼娇鐢ㄧ殑WebGLRenderer娓叉煋鍣紝Three.js杩樻彁渚涗簡鍏朵粬鍑犵娓叉煋鍣紝褰撶敤鎴蜂娇鐢ㄧ殑娴忚鍣ㄥお鏃ф垨鑰呭叾浠栧師鍥犱笉鏀寔WebGL鏃讹紝鍙互灏嗘覆鏌撳櫒闄嶇骇銆傞櫎浜嗗垱寤烘覆鏌撳櫒鐨勫疄渚嬩箣澶栵紝鎴戜滑杩橀渶瑕佸湪鎴戜滑鐨勫簲鐢ㄧ▼搴忎腑璁剧疆娓叉煋鍣ㄧ殑澶у皬銆備緥濡傦紝鎴戜滑鍙互浣跨敤鎵€闇€娓叉煋鍖哄煙鐨勫搴﹀拰楂樺害锛屼娇娓叉煋鍣ㄦ覆鏌撶殑鍦烘櫙鍏呮弧鎴戜滑鐨勫簲鐢ㄧ▼搴忋€傚洜姝わ紝鎴戜滑鍙互灏嗘覆鏌撳櫒鐨勫楂樿缃负娴忚鍣ㄧ獥鍙ｇ殑瀹介珮銆傚浜庢€ц兘鏁忔劅鐨勫簲鐢ㄧ▼搴忥紝鍙互浣跨敤setSize浼犲叆涓€涓緝灏忕殑鍊硷紝姣斿window.innerWidth/2鍜寃indow.innerHeight/2锛岃繖灏嗕娇搴旂敤绋嬪簭浠ヤ竴鍗婄殑闀垮娓叉煋鍦烘櫙銆傚鏋滄偍甯屾湜淇濇寔搴旂敤绋嬪簭鐨勫ぇ灏忥紝浣嗕互杈冧綆鐨勫垎杈ㄧ巼鍛堢幇锛屾偍鍙互璋冪敤setSize骞跺皢updateStyle锛堢涓変釜鍙傛暟锛夎缃负false銆備緥濡傦紝鍋囪鎮ㄧ殑
