本發(fā)明屬于3d圖形顯示，尤其涉及一種應用于3d展示平臺的物體模型展示方法及系統(tǒng)。

背景技術：

1、隨著虛擬現(xiàn)實（vr）和增強現(xiàn)實（ar）技術的發(fā)展，3d模型在網頁中的展示變得越來越普遍。webgl技術使得在瀏覽器中無需插件即可渲染3d圖形成為可能，而基于webgl的3d引擎如babylonjs則提供了更為豐富的功能和優(yōu)化工具。glb格式作為一種通用的3d模型交換格式，其優(yōu)化技術對于提高模型的加載速度和渲染性能至關重要。然而，現(xiàn)有技術在模型細節(jié)的真實還原、用戶交互體驗以及電商集成方面仍存在不足。

2、通過上述分析，現(xiàn)有技術存在的問題及缺陷為：（1）3d模型在web端的展示中，模型細節(jié)展示不足，無法充分展示復雜表面特性的物體，如陶瓷和文物類模型的釉度和色澤。（2）交互體驗有限：用戶交互方式不夠直觀和流暢，缺乏有效的旋轉拖拽和縮放功能。（3）電商集成不完善：缺少與電商平臺的無縫集成，無法實現(xiàn)即看即買的購物體驗。

技術實現(xiàn)思路

1、為克服相關技術中存在的問題，本發(fā)明公開實施例提供了一種應用于3d展示平臺的物體模型展示方法及系統(tǒng)。本發(fā)明目的在于提供一種更為精細的3d模型展示方法，并優(yōu)化用戶交互體驗和電商集成功能。

2、所述技術方案如下：應用于3d展示平臺的物體模型展示方法，包括：

3、s1，對babylonjs引擎中的燈光和材質進行優(yōu)化預設；

4、s2，增強用戶交互，在web端完成旋轉拖拽、放大縮小交互；

5、s3，電商平臺鏈接集成，后臺管理端進行模型編輯時，添加第三方電商平臺鏈接，進行一鍵下單，跳轉至第三方電商平臺，實現(xiàn)即看即買購物方式。

6、在步驟s1中，優(yōu)化預設燈光，包括：

7、s1011，優(yōu)化整體光照的環(huán)境光，使用環(huán)境光模擬天空光；

8、s1012，優(yōu)化光源方向和陰影效果的方向光，使用方向光模擬太陽光；

9、s1013，優(yōu)化用于模擬局部光源點的光源，使用點光源和聚光燈模擬局部光源；

10、s1014，綜合應用，組合使用多種光源，優(yōu)化整體場景光照。

11、在步驟s1中，優(yōu)化預設材質，包括：

12、s1021，使用pbr材質優(yōu)化模型表面的逼真，其中，pbr材質的參數(shù)包括：金屬度、粗糙度、反射率、環(huán)境遮蔽；

13、s1022，使用反射和折射優(yōu)化材質的真實感，反射使用反射貼圖模擬材質表面的反射效果；折射使用折射貼圖模擬材質的折射效果；

14、s1023，通過參數(shù)變化進行畫面逼真的判斷，包括：利用光照強度衡量光源對場景的影響，利用陰影質量衡量陰影的清晰度和真實感，利用反射和折射效果衡量材質表面的反射和折射是否自然，以及利用環(huán)境遮蔽效果衡量陰影區(qū)域的真實感。

15、在步驟s1中，對babylonjs引擎中的燈光和材質進行優(yōu)化預設后，還需進行：利用色調映射將hdr圖像映射到低動態(tài)范圍ldr顯示設備上，實現(xiàn)色調映射提升3d展示平臺的視覺效果；利用色調映射將hdr圖像映射到低動態(tài)范圍ldr顯示設備上包括，s1031，使用babylon.js進行色調映射，具體包括：

16、s10311，啟用hdr渲染；

17、s10312，通過設置渲染管線的色調映射類型選擇色調映射算法；

18、s10313，調整色調映射參數(shù)，調整色調映射的曝光和對比度參數(shù)，獲得最佳視覺；

19、s1032，使用三方庫或自定義shader，包括：

20、s10321，加載shader文件，加載自定義的色調映射shader文件；

21、s10322，將自定義的shader材質應用到場景中的模型；

22、所述實現(xiàn)色調映射顯著提升3d展示平臺的視覺效果包括：

23、（a）動態(tài)調整色調映射參數(shù)，根據(jù)場景的光照條件，動態(tài)調整色調映射的參數(shù)，適應不同的環(huán)境和光照變化；

24、（b）結合后期處理效果和環(huán)境遮蔽圖像處理技術進一步提升整體表現(xiàn)。

25、在步驟s1中，優(yōu)化預設的燈光和材質后，還需進行：景深，模擬相機的焦距效果，使前景和背景具備層次；具體包括：

26、（a）景深參數(shù)，包括：焦距、光圈、模糊程度；

27、（b）使用babylon.js實現(xiàn)景深效果，包括：

28、（b01）啟用babylon.js提供的景深渲染管線；

29、（b02）調整景深參數(shù)，根據(jù)需要動態(tài)調整景深效果的參數(shù)，實現(xiàn)不同的焦距效果；

30、（b03）自定義shader實現(xiàn)景深效果，利用編寫景深fragment?shader，以及應用自定義shader材質，將自定義的景深shader材質應用到場景中；

31、（c）動態(tài)調整景深效果，包括：基于相機位置和目標動態(tài)調整焦距和光圈。

32、在步驟s1中，優(yōu)化預設的燈光和材質后，還需進行：

33、優(yōu)化模型和紋理，使模型的多邊形數(shù)量和紋理分辨率適中；具體包括：

34、s1041，優(yōu)化模型的多邊形數(shù)量，通過使用簡化工具、層次細節(jié)lod優(yōu)化，以及進行距離判斷；

35、s1042，優(yōu)化紋理的分辨率，進行紋理尺寸適配，壓縮、mip映射以及手動創(chuàng)建進行優(yōu)化；

36、s1043，實現(xiàn)適中控制和調節(jié)，進行動態(tài)調整、測試和優(yōu)化，以及使用性能監(jiān)控工具實時監(jiān)測場景的性能狀況。

37、在步驟s2中，增強用戶交互包括：

38、s201，創(chuàng)建基本的場景和攝像機，在javascript中創(chuàng)建場景，并添加arcrotatecamera作為攝像機，使用戶進行旋轉和縮放視角；

39、s202，添加交互的3d模型，并設置3d模型基本的材質和位置；

40、s203，監(jiān)聽鼠標事件實現(xiàn)交互以及實現(xiàn)模型的旋轉功能。

41、在步驟s2中，在web端完成旋轉拖拽、放大縮小交互包括：

42、s201，使用babylonjs引擎中的arcrotatecamera類實現(xiàn)旋轉和縮放；

43、s202，通過javascript來監(jiān)聽鼠標的拖拽和滾輪事件，并對模型進行旋轉和縮放操作；

44、s203，使用lod技術，根據(jù)攝像機距離切換不同細節(jié)層次的模型，優(yōu)化渲染性能，并進行實時陰影和反射設置；

45、s204，使用pbr材質，使模型表面的光照效果逼真；以及預設燈光，包括環(huán)境光、方向光和局部光源，模擬真實光照場景；

46、s205，通過色調映射調整整個場景的顏色表現(xiàn)，優(yōu)化視覺效果；以及使用景深技術模擬相機的焦距，使前景和背景具備層次。

47、步驟s3具體包括：

48、s301，后臺管理系統(tǒng)設計，包括：

49、s3011，用戶界面設計，在后臺管理系統(tǒng)的模型編輯界面中，根據(jù)提供的一輸入框，供用戶添加第三方電商平臺的商品鏈接；

50、s3012，數(shù)據(jù)庫設計，在數(shù)據(jù)庫中為每個模型記錄增加一個字段，用于存儲第三方電商平臺的商品鏈接。

51、s302，前端頁面設計，包括：

52、s3021，顯示商品鏈接，在前端頁面展示模型時，顯示用戶在后臺添加的第三方電商平臺商品鏈接；根據(jù)提供的一鍵下單按鈕，觸發(fā)跳轉到第三方電商平臺的對應商品頁面；

53、s3022，使用javascript實現(xiàn)一鍵跳轉，當用戶選取一鍵下單按鈕時，調用`oneclickbuy`函數(shù)并傳入商品鏈接，在新標簽頁中打開第三方電商平臺的商品頁面；

54、s303，后臺管理功能實現(xiàn)，包括：鏈接輸入和保存，通過后臺管理端，在編輯模型時輸入第三方電商平臺的商品鏈接，并將該鏈接保存在數(shù)據(jù)庫中；

55、s304，后端服務實現(xiàn)，包括：通過開發(fā)的api接口，用于接收和保存商品鏈接；

56、s305，安全與優(yōu)化，包括：

57、s3051，對輸入的鏈接進行驗證，確保格式正確且指向合法的電商平臺，以及使用https協(xié)議使數(shù)據(jù)傳輸安全；

58、s3052，優(yōu)化數(shù)據(jù)庫查詢和存儲操作。

59、本發(fā)明的另一目的在于提供一種應用于3d展示平臺的物體模型展示系統(tǒng)，該系統(tǒng)通過所述的應用于3d展示平臺的物體模型展示方法實現(xiàn)，該系統(tǒng)包括：

60、優(yōu)化預設的燈光和材質模塊，用于對babylonjs引擎中的燈光和材質進行優(yōu)化預設；

61、增強用戶交互模塊，用于在web端完成旋轉拖拽、放大縮小交互；

62、電商平臺鏈接集成模塊，用于后臺管理端進行模型編輯時，添加第三方電商平臺鏈接，進行一鍵下單，跳轉至第三方電商平臺，實施即看即買購物方式

63、結合上述的所有技術方案，本發(fā)明所具備的有益效果為：

64、第一、本發(fā)明提供的展示系統(tǒng)細節(jié)展示更精細，能夠更真實地還原模型細節(jié)，尤其是陶瓷和文物類模型的釉度和色澤。用戶體驗更優(yōu)化：交互功能的增強使得用戶可以更加自然地操作模型，提升了用戶的沉浸感和滿意度。電商功能更完善：電商平臺的集成為用戶提供了更加便捷的購物體驗，有助于提高轉化率和用戶粘性。

65、第二、預期收益和商業(yè)價值，提高用戶粘性：通過優(yōu)化3d展示效果和用戶交互體驗，使用戶在平臺上的停留時間增加，提高用戶粘性。提升轉化率：一鍵跳轉至電商平臺的功能，簡化了購物流程，方便用戶直接購買，提高了平臺的轉化率和銷售額。降低運營成本：通過優(yōu)化渲染和加載速度，減少服務器資源消耗，降低運營成本。增強品牌形象：高質量的3d展示效果和便捷的購物體驗，有助于提升平臺的品牌形象和用戶滿意度。市場競爭力提升：在激烈的市場競爭中，提供更優(yōu)質的3d展示和交互體驗，提升市場競爭力。用戶增長：通過更好的用戶體驗和便捷的購物流程，吸引更多用戶注冊和使用平臺。多元化收入：通過與第三方電商平臺的集成，開辟新的收入渠道，實現(xiàn)多元化收入來源。

66、第三、目前市面上大多數(shù)3d展示平臺在圖形渲染和用戶交互方面存在明顯不足，難以滿足用戶對高質量視覺效果和流暢操作體驗的需求。本發(fā)明通過優(yōu)化babylonjs引擎中的燈光和材質，并增強用戶交互功能。集成一鍵跳轉至電商平臺的功能，實現(xiàn)即看即買的購物方式，在國內外尚無廣泛應。

67、第四、高質量3d展示和交互體驗：傳統(tǒng)3d展示平臺由于技術限制，難以同時兼顧圖形質量和交互體驗。本發(fā)明通過優(yōu)化燈光和材質設置，以及提升交互操作的響應速度，有效解決了這一技術難題。一體化購物體驗：用戶在3d展示平臺瀏覽商品時，往往需要跳轉到不同的網站進行購買，購物流程繁瑣。本發(fā)明通過集成第三方電商平臺鏈接，實現(xiàn)一鍵跳轉購物。

68、第五、本發(fā)明克服了普遍存在認為3d展示效果和用戶交互體驗的偏見。許多開發(fā)者認為，為了保證圖形質量，必須犧牲交互流暢性，或反之亦然。本發(fā)明通過優(yōu)化babylonjs引擎，證明了可以在提升圖形質量的同時，保持流暢的用戶交互體驗。