当前位置: 首页 > Web前端 > HTML5

油田系统3D布局可视化解决方案

时间:2023-04-05 16:18:19 HTML5

杩戞棩锛屾垜浠鍦ㄤ笌鏌愬叕鍙告唇璋堥」鐩悎浣溿€備粬浠叕鍙镐富瑕佺敓浜ф补鐢扮浉鍏宠澶囷紝姣斿娌圭綈杞︺€佸帇鍔涜溅銆佹车杞︾瓑锛屽湪鎴戠殑鍗拌薄涓紝鍙鏄煶娌圭浉鍏崇殑浼佷笟锛屽彧瑕佽寰楃閽辫繎锛岎煒勩€備粬浠殑鑰佹澘鐪嬪埌鎴戜滑鍏徃鐨?D浜у搧鍚庯紝鍗拌薄娣卞埢銆傛劅鍙癸紝濡傛灉鎴戜滑鐨勬补鐢扮鐞嗚兘鏈夎繖鏍风殑绔嬩綋绯荤粺灏卞ソ浜嗐€傛垜浠箣鍓嶆病鏈夊湪娌圭敯琛屼笟鍋氳繃3D鍙鍖栭」鐩紝浣嗘槸鎴戜滑鍦?D鍙鍖栨柟闈㈣繕鏄湁寰堝缁忛獙鐨勶紝姣斿鏁版嵁涓績銆佸尰闄€佸鏍$瓑鐨?D鍙鍖栭」鐩紝杩樻湁鏅烘収鍥尯銆佹櫤鎱у煄甯傦紝鍩庨晣鏂瑰悜鐨勬櫤鑳界瓑璺?D鍙鍖栥€傛潵鐪嬩竴浜?D鍙鍖栧浘鐗囷細铏界劧鎴戜滑娌℃湁鐩存帴鍋氳繃娌圭敯鐨?D鍙鍖栵紝浣嗘槸鏈変簡浠ヤ笂3D鏂规鐨勬妧鏈Н绱紝鍋氳捣鏉ヤ篃涓嶄細澶毦銆備簨瀹炰笂锛屽鎴风殑闇€姹傚苟涓嶆槸閽堝鏌愪釜娌圭敯鍦烘櫙鏋勫缓涓€涓?D鍙鍖栧満鏅€傜浉鍙嶏紝鎴戜滑鎯充负娌圭敯鍒涘缓涓€涓笁缁村竷灞€宸ュ叿銆傞€氳繃甯冨眬宸ュ叿锛屾垜浠彲浠ヨ嚜鐢辨惌寤轰笉鍚岀殑娌圭敯鍦烘櫙銆傝繖姣旂洿鎺ユ瀯寤?D鍦烘櫙瑕佸洶闅惧緱澶氥€傛墍璋撲竾浜嬪紑澶撮毦锛岄毦鍦ㄤ笉寮€濮嬨€備笘鐣屼笂鐨勪簨鎯呮湁闅炬湁鏄擄紝鍘诲仛灏卞浜嗐€傚湪涓氬姟浜哄憳鍜屽鎴风璁㈠悎鍚屽苟姝e紡鎵瑰噯椤圭洰鍚庯紝鎴戜滑鐨勮璁″皬濮愬鍜屽紑鍙戝晢灏忓摜鍚勫徃鍏惰亴銆備笅闈㈣涓€涓嬮」鐩殑澶ф鍐呭銆傚缓绔嬫ā鍨嬪簱鐨勭涓€姝ユ槸寤烘ā銆傝璁″洟闃熶娇鐢?D寤烘ā宸ュ叿3dmax鎴朿4d瀵规补鐢拌澶囨ā鍨嬭繘琛屽缓妯°€傚缓妯″悗瀵煎嚭鍚庣紑涓簅bj鎴杇ltf鏍煎紡鐨勬枃浠讹紝杩欎袱绉嶆牸寮忔槸鎴戜滑3D娓叉煋寮曟搸鏀寔鐨勬渶濂界殑鏂囦欢鏍煎紡銆傛墍鏈夊缓妯″悗鐨勬ā鍨嬫枃浠舵渶缁堥兘浼氭斁鍦ㄥ悗鍙版ā鍨嬪簱涓€傛ā鍨嬪簱鐨勭鐞嗙洰褰曞涓嬪浘鎵€绀猴細鍔犺浇妯″瀷鍔犺浇妯″瀷鍙互浣跨敤寮曟搸妯″瀷鐨勫姞杞藉嚱鏁板姞杞斤紝姣斿鍔犺浇obj妯″瀷锛岀ず渚嬩唬鐮佸涓嬶細newmono.OBJMTLLoader().load('yaliche.obj','yaliche.mtl','',(node)=>{node.type='obj';box.addByDescendant(node);},);涓婇潰鍔犺浇浜嗗帇鍔涜溅鐨勬ā鍨嬨€傚姞杞芥ā鍨嬫槸涓€涓紓姝ヨ繃绋嬶紝鎵€浠ヤ細鏈夊洖璋冨嚱鏁般€傚姞杞藉畬鎴愬悗锛屽湪鍥炶皟鍑芥暟涓紝灏嗘ā鍨嬫枃浠剁敓鎴愮殑3D瀵硅薄娣诲姞鍒板満鏅鍣ㄧ洅涓€傛坊鍔犲悗锛屾垜浠殑3D瀵硅薄灏变細鏄剧ず鍦ㄥ満鏅腑锛屽涓嬪浘锛氭瀯寤虹紪杈戝櫒妗嗘灦缁忚繃涓庤璁″洟闃熷拰寮€鍙戝洟闃熺殑璁ㄨ锛屽垵姝ヨ璁′簡鎴戜滑缂栬緫鍣ㄧ殑妗嗘灦鍜岃鍥撅紝澶ц嚧鐨勫瑙傚涓嬶細view鐨勫乏涓婅鏄垜浠殑logo锛屼笂闈㈡槸toolbar銆傚乏渚у垎涓哄満鏅尯鍜岀粍浠跺尯銆傚満鏅尯鍩熸槸鐢ㄤ簬鍒涘缓3D鍦烘櫙鐨勫垪琛ㄣ€傜粍浠跺尯涓昏鏄ā鍨嬪垪琛紝涔熸湁涓€浜沞charts鍥捐〃缁勪欢銆備腑闂撮儴鍒嗘槸3D鍦烘櫙娓叉煋鍖哄煙銆傚浜庤繖涓〉闈㈠竷灞€锛屾垜瑙夊緱涓嶉渶瑕佸仛澶鐨勬妧鏈槓杩般€傚熀鏈笂鎳備竴鐐瑰墠绔紑鍙戠殑浜洪兘鑳借揪鍒扮被浼肩殑鏁堟灉銆?divclass="layui-layoutlayui-layout-admin">鍦烘櫙

缁勪欢
宸︿晶杈规爮鍖呮嫭涓ら儴鍒嗭紝涓€鏄満鏅垪琛紝浜屾槸妯″瀷鍒楄〃鍦烘櫙鍒楄〃鏄竴涓爲褰㈢粍浠讹紝妯″瀷鍒楄〃鏄竴涓墜椋庣惔缁勪欢锛屽涓嬪浘锛氭ā鍨嬪垪琛ㄧ殑鍒涘缓杩囩▼鏄繖鏍风殑锛岄鍏堜粠鍚庣鑾峰彇鎵€鏈夋ā鍨嬶細getComponentTree({params:{owner:user}},'鍚屾鍒颁簯缁勪欢鏍戝け璐?).then((res)=>{if(res){consttreeData=res.data.data;treeData.forEach(({data})=>{this.appendModelBtn(data,true);});//this.renderTreeDom(res.data.data);}});閫氳繃姣忎釜妯″瀷鍒涘缓妯″瀷瀵规寜閽紝鍑芥暟涓篴ppendModelBtn锛屽涓嬶細appendModelBtn(modelData,isNew){constdomWrap=this.groupDom[modelData.group];if(!domWrap){console.log('缂哄皯璇ョ被鍨嬪搴旂殑group',modelData.group);if(modelData.category==='skyBox'){modelData.isNew=true;skyData.push({modelData});}}else{domWrap.querySelector('.tree-wrap').appendChild(this.createModelBtnDom(modelData,isNew));}}闇€瑕佹敞鎰忕殑鏄瘡涓ā鍨嬫寜閽兘闇€瑕佹湁鎷栨嫿鍔熻兘銆俶odel鎸夐挳涓婇渶瑕佺洃鍚琩rag鎴栬€卍ragstart浜嬩欢锛屽皝瑁呭埌涓€涓嫭绔嬬殑绫籇ragger.js涓紝閲岄潰涓撻棬澶勭悊浜哾ragstart浜嬩欢锛歛ddDragger(parent,subClass,option){parent.addEventListener('dragstart',(e)=>{lettarget=null;//鑾峰彇鎵€鏈夊啋娉″厓绱燾onstpath=eventPath(e);for(leti=0;ifalse);make.Default.path='./static/myModellib/';network.setClearColor(0,0,0);network.setClearAlpha(0);createobject涔嬪悗锛岃缃戠粶閫傚簲涓棿鍖哄煙鐨勫ぇ灏忥細mono.Utils.autoAdjustNetworkBounds(network,document.querySelector('.app'),'clientWidth','clientHeight',);鍏朵腑缃戠粶涓婄殑box瀵硅薄鏄敤鏉ョ鐞嗚鍔犺浇鐨?D瀵硅薄妯″瀷鐨勩€傚涓婃墍杩帮紝灏嗘嫋鍔ㄤ簨浠舵坊鍔犲埌妯″瀷鍒楄〃涓€傛ā鍨嬪垪琛ㄤ笂鐨勬ā鍨嬪彲浠ラ€氳繃鎷栨嫿鐨勬柟寮忔坊鍔犲埌缃戠粶瀵硅薄涓紝鎵€浠ョ綉缁滄坊鍔犲璞¢渶瑕佹坊鍔犵浉搴旂殑浜嬩欢锛歰nup:(e)=>{if(!this.sceneTree.senceId&&!window.debug){layui.layer.msg('璇峰厛鍒涘缓鎴栭€夋嫨鍦烘櫙',{time:2000,});杩斿洖;}//褰撻紶鏍囦笉鍦ㄧ敾甯冧腑鏃跺垱寤篿f(isPosInCanvas(network,e)){network.createElement({e,configString,sentenceId:this.sceneTree.senceId,});}}锛屽綋妯″瀷浠庡乏渚фā鍨嬪垪琛ㄦ嫋鍒扮綉缁滃璞℃椂锛岄紶鏍噈ouseup浜嬩欢鍚庯紝鍒涘缓妯″瀷瀹炰緥锛歯etwork.createElement({e,configString,sentenceId:this.sceneTree.senceId,});鑷虫锛屽姞杞芥暣涓ā鍨嬪垪琛ㄥ拰閫氳繃鎷栨嫿妯″瀷鍒涘缓妯″瀷瀹炰緥鐨勮繃绋嬪氨瀹屾垚浜嗐€備緥濡傛渶缁堟嫋鏀剧殑娌圭敯鍦烘櫙濡備笅锛氬湪3D鍦烘櫙涓紝闇€瑕佽皟鏁?D妯″瀷鐨勪綅缃€佹棆杞搴﹀拰缂╂斁姣斾緥锛屽彲浠ラ€氳繃灞炴€ч潰鏉胯繘琛岃皟鏁达紱鎴栬€呭彲浠ラ€氳繃3D缂栬緫鍔熻兘鐩存帴鍦?D鍦烘櫙涓紪杈戞ā鍨嬭皟鏁存爣璁帮紝浣跨敤璋冩暣缂栬緫鍔熻兘锛屽彧闇€娣诲姞濡備笅涓€琛屼唬鐮侊細consteditInteraction=newmono.EditInteraction(network);editInteraction.setScaleable(false);editInteraction.setRotateable(false);editInteraction.setTranslateable(鐪?;editInteraction.setDefaultMode('');network.setInteractions([...network.getInteractions(),editInteraction]);EditInteraction绫荤敤浜庤皟鏁存ā鍨嬬殑浣嶇疆銆佹棆杞搴﹀拰缂╂斁姣斾緥銆傚彲浠ラ€氳繃閿洏璋冩暣EditInteraction鐨勫睘鎬э細case82://r褰撳厓绱犺閫変腑鏃讹紝鍒囨崲鎿嶄綔涓烘棆杞琲f(this.network.getIsMonoElement(this.network.currComponent)){consteditInteraction=this.network.getInteractions()[2];editInteraction.setScaleable(false);editInteraction.setRotateable(true);editInteraction.setTranslateable(false);}浼戞伅;case84://t褰撴湁鍏冪礌琚€変腑鏃讹紝鍒囨崲鎿嶄綔姝e湪绉诲姩if(this.network.getIsMonoElement(this.network.currComponent)){consteditInteraction=this.network.getInteractions()[2];editInteraction.setScaleable(false);editInteraction.setRotateable(false);editInteraction.setTranslateable(true);}浼戞伅;case89://y褰撴湁鍏冪礌琚€変腑鏃讹紝鍒囨崲鎿嶄綔鏄缉鏀緄f(this.network.getIsMonoElement(this.network.currComponent)){consteditInteraction=this.network.getInteractions()[2];缂栬緫浜掑姩ion.setScaleable(鐪?;editInteraction.setRotateable(false);editInteraction.setTranslateable(false);}浼戞伅;r閿垏鎹㈠埌鏃嬭浆瑙掑害璋冩暣锛歵閿垏鎹㈠埌浣嶇疆璋冩暣锛歽閿垏鎹㈠埌缂╂斁璋冩暣锛氭嫋鍔ㄥ垱寤哄満鏅悗锛屾瘡涓璞′篃鍙互涓庡疄鏃舵暟鎹鎺ャ€傚鎺ュ悗鏁堟灉濡備笅锛氬満鏅垱寤哄拰鏁版嵁瀵规帴瀹屾垚鍚庯紝灏卞彲浠ュ彂甯冨満鏅簡锛岀偣鍑诲伐鍏锋爮涓婄殑棰勮鎸夐挳灏卞彲浠ュ畬鎴愬満鏅簡涔嬪墠鏈€缁堝彂甯冪殑鍙戝竷棰勮濡備笅:鏈夋剰鑾峰彇灏忕紪锛岃鍙戦偖浠惰嚦锛歵erry.tan@servasoft.com娆㈣繋鍏虫敞鍏紬鍙封€淚Tman椋氬ぇ鍙斺€濄€傞鍙旓紝10澶氬勾寮€鍙戠粡楠岋紝鐜颁换鍏徃绯荤粺鏋舵瀯甯堛€佹妧鏈€荤洃銆佹妧鏈煿璁笀銆佽亴涓氳鍒掑笀銆傚璁$畻鏈哄浘褰㈠銆乄ebGL銆佸墠绔彲瑙嗗寲鏈夋繁鍏ョ爺绌躲€傚绋嬪簭鍛樻€濈淮鑳藉姏鐨勮缁冧笌璁粌锛岀▼搴忓憳鑱屼笟鐢熸动瑙勫垝鏈夌潃娴撳帤鐨勫叴瓒c€?/p>