原创 三維引擎導入obj模型全黑總結 obj 模型沒有法線向量 mtl文件中設置模型顏色爲黑色 mtl文件中貼圖引用了本地路徑 導入的場景沒有設置燈光 結語
最近有客戶試用我們的三維平臺，在導入模型的時候，會出現模型全黑和不可見的情況。本文說下全黑的情況。 經過測試，發現可能有如下幾種情況。 obj 模型沒有法線向量 如果obj模型導出的時候沒有導出法線向量，會導致模型不能接受光照，從而導出的模
2021-12-10 16:57:44
5
原创 使用SVG做模型貼圖的思路 直接作爲貼圖 通過canvas 動態生成貼圖 拓展思路 總結
大多數情況下，三維模型使用PNG，JPG作爲模型的貼圖，當然爲了性能優化，有時候也會使用壓縮貼圖來提高渲染效率和較少GPU壓力。 今天提供一種新的思路，使用SVG作爲模型的貼圖，可以達到動態調整圖片精度的效果。 使用svg作爲貼圖的思路，有
2021-11-24 10:15:27
原创 水廠流程三維場景可視化解決方案 背景 方案設計 三維場景展示
背景 最近有客戶諮詢我們三維可視化編輯器，說看到我們三維可視化編輯器做的案例，也想實現自己水廠淨水處理流程這塊的可視化展示。想通過這種真實的三維可視化展示，進行線上銷售，以便成交更多的客戶，減少疫情對自己的影響。通過溝通交流，客戶提出了幾個
2021-07-20 05:07:50
原创 canvas繪製圖像輪廓效果 繪製邊框 繪製輪廓 使用算法（marching-squares-algorithm） 總結 參考文檔
在2d圖形可視化開發中，經常要繪製對象的選中效果。 一般來說，表達對象選中可以使用邊框，輪廓或者發光的效果。 發光的效果，可以使用canvas的陰影功能，比較容易實現，此處不在贅述。 繪製邊框 繪製邊框是最容易實現的效果，比如下面的圖片
2021-04-02 14:47:46
原创 智慧園區可視化設計思路 智慧園區可視化設計思路 前言 一、確認風格 二、模塊劃分 總結
智慧園區可視化設計思路 前言 隨着物聯網技術的不斷髮展，推動了園區的智能化管理與服務不斷升級。科技的進步激發市場訴求，智能化園區的市場規模也越來越大。 在經濟快速發展和政府政策的推動下，伴隨着國內智慧城市建設步伐的加快，園區規劃建設整體性越
2021-01-11 00:11:04
1
原创 webgl智慧樓宇發光效果算法系列之高斯模糊 渲染流程
如果使用過PS之類的圖像處理軟件，相信對於模糊濾鏡不會陌生，圖像處理軟件提供了衆多的模糊算法。高斯模糊是其中的一種。 在我們的智慧樓宇的項目中，要求對樓宇實現樓宇發光的效果。 比如如下圖所示的簡單樓宇效果： 樓宇發光效果需要用的算法之一就
2020-12-26 00:48:18
原创 canvas可視化效果之內陰影效果 canvas可視化效果之內陰影效果 楔子 外發光效果 內陰影 如何繪製內陰影效果 同時繪製內外陰影效果 內陰影的缺陷 實現閃爍的效果 結語
canvas可視化效果之內陰影效果 楔子 在之前的一個軌道交通可視化項目中，運用到了很多繪製技巧。 可以參考 之前的一篇文章 《利用canvas陰影功能與雙線技巧繪製軌道交通大屏項目效果》 效果圖中的軌道，就同時存在外發光和內發光效果的效
2020-12-26 00:48:18
原创 webgl智慧樓宇發光系列之線性採樣下高斯模糊 效率問題 線性採樣 總結 參考文檔
前面一篇文章 <webgl智慧樓宇發光效果算法系列之高斯模糊>, 我們知道了 高斯模糊的本質原理，就是對每個像素，按照正態分佈的權重去獲取周邊像素的值進行平均，是一種卷積操作。 同時我們可以指定周邊像素的數量，比如可以是3X3，或者5X
2020-12-26 00:48:18
原创 拓撲/大屏/三維編輯器的設計與思考 易用性 通用性 靈活性和易用性 可擴展性 總結
從去年年初開始，我們團隊內部就在做兩個編輯器： 3d編輯器 支持搭建3d場景。 拓撲/大屏編輯器 支持搭建大屏/拓撲/組態場景。 開發編輯器的主要目是爲了提高團隊內部項目的交付效率，目前 兩個編輯器都引用到團隊的相關項目中。當然，編輯
2020-10-14 16:50:57
原创 2.5D(僞3D)站點可視化第一彈 楔子 2.5D的思想火花 2.5D技術概述 三維空間定義 模型定義 投影算法。
楔子 最近要做一個基站站點的可視化呈現項目。 我們首先嚐試的是三維的可視化技術來程序，但是客戶反饋的情況是他們的客戶端電腦比較差，性能效率都會不好，甚至有的還是雲主機。 因此我們先做了一個性能比較極致的3Ddemo，如下圖所示： 爲了能
2020-09-06 23:15:35
原创 油田系統三維佈局可視化解決方案 搭建模型庫 加載模型 搭建編輯器框架
最近和一家公司在談一個項目合作,他們公司主要是做油田相關設備的，比如油罐車、壓力車、泵車等。 我的印象中只要和石油相關的企業，就感覺和錢捱得好近，😄 。 他們老闆看了我們公司的三維產品後，大爲讚歎。 驚呼，我們油田的管理最好也能上一套這樣的
2020-09-06 23:15:35
原创 機器人制證系統大屏可視化 0X01項目背景 0X02設計稿 0X03 任務分解實現 0x03 場景生成
0X01項目背景 本項目是一個機器人制證的可視化系統。 其中包括制證設備的顯示和監控，質檢設備的顯示和監控；同時也包括AGV機器人的顯示和監控。 制證設備用於製作證書，質檢設備用於合格檢查，而AGV機器人用於運輸；AGV機器人還需要監控電量
2020-09-06 23:15:35
原创 三維組態可視化解決方案 製作模型 加載模型 三維場景搭建 拖拽模型生成場景 創建管路 管路動畫 整體效果
HTML5 WebGL 在三維中的應用，已經發展的如火如荼，使其在三維組態（工業控制）方面也變得簡單易行！ 三維組態軟件提高了工業控制的管理效率，讓工業控制的資源管理、風險管控得到很大的改善。 傳統的三維組態一般都是本地應用， 該案例使
2020-09-06 23:15:35
原创 大屏可視化之番外篇圖標/圖表製作 圖標1 圖標2 圖標3 圖標4，5 圖表 總結
在很多可視化項目中，會用到不少的小圖標或者簡單的chart圖表之類的。 實際項目開發中，往往是讓設計人員把相關的圖標做成矢量圖或者位圖，交給開發人員，開發人員直接使用到實際的項目中去。 事實上，一些簡單的圖標，也可以直接使用代碼來繪製生成。
2020-09-04 23:16:21
原创 webgl徑向模糊實現體積光 體積光介紹 常用實現思路 徑向模糊實現體積光 有關性能優化 效果圖
體積光介紹 首先，我們要確認一下什麼是體積光。體積光通俗來說是我們能看見的”光路“，並不是所有燈光都會形成體積光效果，它是光照到大氣中粒子散射後得到的效果（丁達爾效應）。我們有時候還會看到一束束光散開的效果，這是光在傳播過程中遇到了障礙物（
2020-09-02 23:12:56