HiNC-Deploy/Hi.Sample.Webapi

Fork 0

iambossTC 68c8096686 init

2025-07-18 20:25:57 +08:00

3.2 KiB

Raw Blame History

Hi.Sample.Webapi

這是一個展示如何使用 Hi.Webapi 功能的範例專案。

專案描述

本專案示範了如何：

使用 Hi.Webapi 的 RenderingService 和 RenderingHub
建立自訂的 Controller 來創建測試 3D 物件
整合 SignalR 進行即時渲染通訊
實作 IDisplayee 介面來定義自訂的 3D 物件

功能特點

3D 物件渲染：使用 Hi.Disp 引擎渲染 3D 圖形
即時通訊：透過 SignalR 實現客戶端與服務器的即時互動
測試物件：包含坐標軸、立方體和地面網格的示範物件
WebGL 渲染：使用 HTML5 Canvas 進行硬體加速渲染
多種前端範例：提供原生 JavaScript 和 Vue.js 兩種實作方式

執行專案

前置需求

.NET 9.0 SDK
Visual Studio 2022 或 VS Code

啟動步驟

在專案目錄下執行：
```
dotnet build
dotnet run
```
開啟瀏覽器訪問：
- 原生 JavaScript 版本：http://localhost:5180/demo-native.html
- Vue.js 內嵌版本：http://localhost:5180/demo-vue-inline.html

專案結構

Hi.Sample.Webapi/
├── Controllers/
│   └── RenderingController.cs    # 範例控制器，展示如何創建測試物件
├── wwwroot/
│   ├── demo-native.html         # 原生 JavaScript 範例頁面
│   └── demo-vue-inline.html     # Vue.js 內嵌式範例頁面
├── Program.cs                   # 應用程式進入點
├── appsettings.json            # 應用程式設定
├── Properties/
│   └── launchSettings.json     # 啟動設定
└── Hi.Sample.Webapi.csproj     # 專案檔案

使用說明

鍵盤控制

F1-F4：切換不同視圖
方向鍵：旋轉視圖
PageUp/PageDown：縮放
Home：重置視圖

滑鼠控制

左鍵拖曳：旋轉視圖
右鍵拖曳：平移視圖
滾輪：縮放

API 端點

GET /api/rendering/engines/count - 獲取活動的渲染引擎數量
POST /api/rendering/test-objects/{sessionId} - 為指定會話創建測試物件

重要類別說明

TestDisplayee

實作 IDisplayee 介面的範例類別，展示如何創建自訂的 3D 物件：

使用 Drawing 類別創建圖形元素
實作 Display 方法來渲染物件
實作 ExpandToBox3d 方法來定義物件邊界

前端實作比較

demo-native.html

使用原生 JavaScript
詳細的實作範例
適合學習底層 API 使用

demo-vue-inline.html

使用 Vue.js 3
所有程式碼內嵌在單一 HTML 檔案中
展示如何用 Vue.js 整合渲染功能
無需外部依賴檔案，方便複製使用

依賴項目

Hi.Webapi - 提供 Web API 和 SignalR 支援
HiNc - 核心 NC 功能
HiDisp - 顯示引擎
HiGeom - 幾何運算
其他 HiAPI 相關專案

注意事項

這是一個範例專案，主要用於展示 Hi.Webapi 的使用方式。實際專案中可能需要根據具體需求進行調整和擴展。

關於 Vue.js 元件

如果您需要使用模組化的 Vue.js 元件（如 Hi.Webapi 專案中的 rendering-canvas.js），請參考 Hi.Webapi 專案的實作方式。本範例使用內嵌方式是為了保持簡單和獨立性。

3.2 KiB Raw Blame History Unescape Escape