由TopoBuilder產(chǎn)品負(fù)責(zé)人王維成介紹「如何用TopoBuilder打造2D數(shù)字數(shù)字孿生」

2D可視化 VS 3D可視化

平時(shí)我們用ThingJS的工具和API通常是做一些3D可視化的開(kāi)發(fā)，在描繪真實(shí)的物理世界時(shí)，3D的場(chǎng)景確實(shí)能給人更加直觀的感受。

然而在數(shù)字孿生的應(yīng)用中，除了描繪物理世界，很多時(shí)候我們也需要去描繪邏輯世界，去表達(dá)對(duì)象之間的邏輯拓?fù)潢P(guān)系，比如組態(tài)工藝流程、網(wǎng)絡(luò)拓?fù)潢P(guān)系等。在對(duì)面這些需求時(shí)，2D的表現(xiàn)方式顯然更為清晰。

我們搭建3D園區(qū)和3D城市，可以使用CampusBuilder和CityBuilder，而面對(duì)2D場(chǎng)景時(shí)，我們?cè)撚檬裁垂ぞ吣兀?/p>

很多人使用Visio來(lái)繪制拓?fù)鋱D，但Visio圖不能對(duì)接外部數(shù)據(jù)，也不能用API來(lái)驅(qū)動(dòng)場(chǎng)景中的對(duì)象狀態(tài)，無(wú)法滿足我們各式各樣的2D可視化需求。為了解決這些問(wèn)題，我們?nèi)麓蛟炝艘豢町a(chǎn)品：TopoBuilder，它可以幫助開(kāi)發(fā)者輕松完成2D場(chǎng)景下的各類可視化需求。

TopoBuilder強(qiáng)大的Web繪圖工具

TopoBuilder是一款簡(jiǎn)單易用、功能強(qiáng)大的web繪圖工具，采用拖拉拽的交互方式，幫助用戶快速繪制拓?fù)鋱D、流程圖、物聯(lián)網(wǎng)、工業(yè)組態(tài)、IT運(yùn)維等多種場(chǎng)景下的視圖。

這是TopoBuilder的主界面，頂部是菜單和工具欄，左側(cè)是形狀庫(kù)，中間是畫布，右側(cè)是屬性和設(shè)置面板，底部是標(biāo)簽頁(yè)和導(dǎo)航器。接下來(lái)我們來(lái)通過(guò)一些特色功能的介紹幫助大家了解這款工具。

豐富圖元+多樣模板

TopoBuilder內(nèi)置豐富的圖元和模板，除了剛才提到的組態(tài)圖、流程圖、網(wǎng)絡(luò)架構(gòu)圖等，我們還支持UML、BPMN、ArchiMate 等多種專業(yè)圖形繪制。

同時(shí)也支持用戶上傳自定義圖形，打造屬于自己的形狀庫(kù)。

我們還預(yù)置了豐富的模板供大家使用，提升2D視圖繪制的效率和美觀度。

對(duì)接外部數(shù)據(jù)+API控制

開(kāi)頭我們有提到，Visio是很多人常用的繪圖工具，但Visio繪制的是“死圖”，無(wú)法對(duì)接外部數(shù)據(jù)和用API控制。很多用戶手中積累了大量Visio圖，為了幫助用戶盤活手中的Visio圖，我們提供了Visio導(dǎo)入的功能，可以完美還原之前在Visio中繪制的視圖。同時(shí)還支持導(dǎo)出PDF、PNG、JPG、SVG等常見(jiàn)的文件格式，方便圖的瀏覽和使用。

輕松在線協(xié)作+歷史版本回溯

說(shuō)到在線協(xié)作，大家應(yīng)該并不陌生，我們常用的騰訊文檔之類的互聯(lián)網(wǎng)產(chǎn)品都具備這個(gè)能力，TopoBuilder也提供了基于websocket的多人實(shí)時(shí)在線協(xié)作能力，滿足多人協(xié)作繪圖的場(chǎng)景。在繪圖過(guò)程中系統(tǒng)會(huì)自動(dòng)生成歷史版本，方便回溯查看，使文件安全有保障。

無(wú)縫對(duì)接ThingJS開(kāi)發(fā)平臺(tái)

作為ThingJS工具體系中的一員，TopoBuilder繪制的視圖，會(huì)自動(dòng)同步到ThingJS在線開(kāi)發(fā)平臺(tái)，用戶可直接引用，并使用ThingJS API中的拓?fù)浣M件進(jìn)行2D可視化應(yīng)用開(kāi)發(fā)，輕松實(shí)現(xiàn)組態(tài)監(jiān)控、場(chǎng)景聯(lián)動(dòng)等數(shù)字孿生應(yīng)用需求。

這里我先簡(jiǎn)單介紹一下ThingJS拓?fù)浣M件，拓?fù)浣M件是ThingJS API中的一個(gè)插件，可以通過(guò)API來(lái)動(dòng)態(tài)控制TopoBuilder產(chǎn)出的2D場(chǎng)景，拓?fù)浣M件在語(yǔ)法設(shè)計(jì)上和ThingJS API基本保持一致，熟悉ThingJS的用戶可以在10分鐘之內(nèi)上手。

我們的DEMO分為兩個(gè)部分，第一部分是編輯器的繪圖細(xì)節(jié)演示，我們?cè)陂_(kāi)發(fā)TopoBuilder的時(shí)候，花了很多時(shí)間在打磨用戶體驗(yàn)，我們從中挑出幾個(gè)來(lái)和大家分享。

第二部分一個(gè)完整2D場(chǎng)景應(yīng)用開(kāi)發(fā)的全過(guò)程，這是一個(gè)火力發(fā)電的工藝流程圖，從繪制2D場(chǎng)景，到使用拓?fù)浣M件控制場(chǎng)景對(duì)象實(shí)現(xiàn)組態(tài)流程和監(jiān)控。

TopoBuilder未來(lái)展望

最后說(shuō)一下TopoBuilderd接下來(lái)的發(fā)展計(jì)劃。我們會(huì)推出零代碼快速配置2D可視化應(yīng)用的功能，目前大家需要使用API，通過(guò)編程來(lái)完成2D應(yīng)用的開(kāi)發(fā)，后面我們編輯器中會(huì)內(nèi)置數(shù)據(jù)對(duì)接的能力和常用的交互配置，零代碼、一站式完成2D場(chǎng)景開(kāi)發(fā)。

同時(shí)也會(huì)打通物聯(lián)森友會(huì)，這是UINO打造的一個(gè)物聯(lián)網(wǎng)產(chǎn)品、方案選品庫(kù)，在這里大家可以快速精準(zhǔn)地找到所需要的產(chǎn)品、方案及合作伙伴。TopoBuilder下一步將打通森友會(huì)，成為物聯(lián)網(wǎng)方案設(shè)計(jì)和交流的工具，提高物聯(lián)網(wǎng)生產(chǎn)活動(dòng)效率。

TopoBuilder將在2022年Q1正式發(fā)布！

關(guān)于UINO優(yōu)锘科技

UINO優(yōu)锘科技成立于2012年，總部位于北京，目前團(tuán)隊(duì)已超過(guò)千人，在上海、廣州、深圳、杭州、南京等地均設(shè)有分支。

自成立至今，UINO秉承數(shù)字孿生的理念，以多維空間大數(shù)據(jù)為基礎(chǔ)，致力于打通邏輯世界和物理世界，并憑借三維可視化交互為核心特點(diǎn)的數(shù)字孿生運(yùn)維管理能力，形成了數(shù)據(jù)中心可視化、智慧園區(qū)、智慧城市、智慧消防等多種數(shù)字孿生運(yùn)運(yùn)場(chǎng)景群。

迄今為止，UINO優(yōu)锘科技已服務(wù)了2,000+行業(yè)領(lǐng)軍企業(yè)，并不斷為全行業(yè)客戶提供數(shù)字孿生可視化解決方案。