Sweet Home 3D 最 Easy 開講：如何透過 Export to HTML 5 外掛程式將專案檔輸出為 HTML 5 互動 3D 網頁格式！

 

使用 Sweet Home 3D 不只是單純的建立 3D 模型與攝影機動畫，還能透過 Export to HTML 5 外掛程式將專案檔輸出為 HTML 5 互動 3D 網頁格式，直接讓使用在線上進行 3D 模型的互動操作！

在 Sweet Home 3D 官方網站的「畫廊」頁面，您就可以針對有興趣的作品按下「3D Animation」，進行即時的「鳥瞰模式」、「虛擬觀視模式」與「已儲存的時間視點」互動操作體驗！



一、下載與安裝 Export to HTML 5 外掛程式

目前最新的版本是在 2020/07/22 釋出的 1.6 版，您可以從以下的官方論壇下載：


1.Sweet Home 3D 安裝版：請直接執行 ExportToHTML5-1.6.sh3p，即可加入。

2. Sweet Home 3D 免安裝版：請將此檔案放入 Sweet Home 3D 軟體的 data / plugins 資料夾。



二、從 Sweet Home 3D 輸出 HTML5

選按「Tools / Export to HTML 5」即可將 Sweet Home 3D 專案檔產生的 HTML 5 相關檔案打包成一個 ZIP 壓縮檔。

※ 強列建議檔案名稱不要使用中文，避免網頁瀏覽時出現問題！



請將壓縮檔解壓縮至一個資料夾中！


 


三、使用 Baby WebServer 在電腦上瀏覽 HTML 5 互動 3D 網頁

目前這些 HTML 5 檔案必須在具有 Web Server 的環境下使用，無法直接在檔案總管中開啟網頁瀏覽， 因此，您必須將這些檔案上傳至您所擁有的 Web Server 網站空間上，或是使用以下兩個方式，暫時將您的電腦變成一台 Web Server。

1.使用精簡型免安裝 Baby WebServer


 解壓縮至資料夾後執行「babyweb.exe」。





 選按 Setting 設定網站資料夾位置(即 Sweet Home 3D HTML 5 壓縮檔解壓縮後的資料夾)。






完成設定後，只要在瀏覽器網址列輸入：localhost 或是 127.0.0.1，開啟「viewHome.html」網頁就可以囉！





2.使用 Web Server for Chrome 瀏覽器擴充工具

這個部份您可以參考這篇教學文章： 教學百寶箱：臨時性的檔案分享與上傳，就交給 Web Server for Chrome 瀏覽器擴充工具！ 

 

 

四、教學影片



※ Sweet Home 3D 官方網站資料與可攜式版本下載：

※ 教學資料總整理：

 ※ 延伸閱讀：

 

留言

張貼留言