Cesium的擴(kuò)展工具包-EarthSDK使用指南1

Cesium的擴(kuò)展工具包-EarthSDK使用指南1

前言

Cesium作為三維GIS和BIM應(yīng)用的主力引擎,目前已經(jīng)受到越來(lái)越多的開(kāi)發(fā)者的青睞磷杏。這兩年筆者也一直做Cesium相關(guān)的開(kāi)發(fā)工作,真切地感受到Cesium的強(qiáng)大溜哮,其豐富的API锣笨、豐富的示例為開(kāi)發(fā)三維GIS/BIM應(yīng)用提供了極大的便利判哥。

為了進(jìn)一步豐富Cesium的開(kāi)發(fā)生態(tài)良蒸,我們把之前在Cesium基礎(chǔ)上開(kāi)發(fā)的功能,以及大量的改良功能茅撞,封裝成若干個(gè)獨(dú)立的js包。這樣也避免開(kāi)發(fā)者重復(fù)造輪子典尾。對(duì)于大屏展示匠抗、C端替代等直接本地部署Cesium的應(yīng)用場(chǎng)景多柑,可以直接免費(fèi)使用我們封裝的EarthSDK擴(kuò)展包初嘹。

EarthSDK簡(jiǎn)介

EarthSDK和Cesium的關(guān)系

EarthSDK和Cesium的關(guān)系圖

EarthSDK中主要包括XbsjEarth.js和XbsjCesium.js兩個(gè)js包屯烦。

XbsjCesium.js用來(lái)擴(kuò)展Cesium所不具備的三維可視化功能,例如視頻融合芍殖、分析工具窃躲、模型壓平等。

XbsjEarth.js則主要目標(biāo)在于封裝出更加易于使用的API接口,盡可能屏蔽掉前端開(kāi)發(fā)工程師所不熟悉的圖形學(xué)、GIS相關(guān)內(nèi)容搏嗡。會(huì)在Cesium的基礎(chǔ)上封裝好一些復(fù)雜的交互操作拉一,并提供極其簡(jiǎn)單的API接口方便調(diào)用。

EarthSDK提供超級(jí)易用的API

  1. 響應(yīng)式屬性

EarthSDK從前端開(kāi)發(fā)者的角度考慮設(shè)計(jì)API旧乞,大部分類(lèi)的屬性都是響應(yīng)式設(shè)計(jì)蔚润,通過(guò)簡(jiǎn)單操作即可監(jiān)控相應(yīng)的屬性變化,通過(guò)bind方便可以實(shí)現(xiàn)屬性的相互綁定尺栖。特別針對(duì)Vue的開(kāi)發(fā)者嫡纠,實(shí)現(xiàn)了和vue的響應(yīng)式屬性的無(wú)縫融合。具體可以參考這篇文章的介紹:三維應(yīng)用的響應(yīng)式設(shè)計(jì)探索延赌。

  1. JSON配置式API

之前使用過(guò)ECharts的同學(xué)可能對(duì)ECharts的操作簡(jiǎn)單印象深刻除盏。ECharts相當(dāng)于把大量的API轉(zhuǎn)成配置式,真正使用時(shí)挫以,只需要通過(guò)setOptions來(lái)進(jìn)行一個(gè)大JSON對(duì)象的配置者蠕,即可完成圖表的創(chuàng)建。

EarthSDK的API設(shè)計(jì)也是受ECharts的啟發(fā)掐松,會(huì)盡量減少不需要的API踱侣,減輕開(kāi)發(fā)者的記憶負(fù)擔(dān)。只需要通過(guò)一個(gè)大JSON配置大磺,就可以完成整個(gè)場(chǎng)景的搭建抡句。

而且,EarthSDK比ECharts更進(jìn)一步量没,可以直接修改相應(yīng)的屬性玉转,即可完成三維場(chǎng)景的動(dòng)態(tài)變化。而ECharts則需要不停地調(diào)用setOption來(lái)進(jìn)行配置殴蹄。以后的文章中會(huì)詳細(xì)說(shuō)明此特性。

EarthSDK并不影響原生Cesium API的調(diào)用

EarthSDK創(chuàng)建場(chǎng)景后猾担,內(nèi)置viewer和scene對(duì)象袭灯,用戶(hù)可以通過(guò)viewer或者scene來(lái)向場(chǎng)景中添加Cesium的原生對(duì)象,和調(diào)用所有原生的Cesium API函數(shù)绑嘹。

樣例程序XbsjEarthUI

XbsjEarthUI

為了更易于理解EarthSDK的使用稽荧,我們開(kāi)發(fā)了一個(gè)樣例程序 XbsjEarthUI(這個(gè)程序也同時(shí)集成到了CesiumLab中)。此樣例程序已經(jīng)開(kāi)源放在Github和Gitee上工腋,基于MIT協(xié)議姨丈,用戶(hù)可以任意修改。

XbsjEarthUI在github上的地址: https://github.com/cesiumlab/XbsjEarthUI

XbsjEarthUI在gitee上的地址:
https://gitee.com/cesiumlab/XbsjEarthUI

EarthSDK和Cesium的關(guān)系圖

EarthSDK擴(kuò)展了若干Cesium不具備的功能

影像糾偏

EarthSDK可以加載百度地圖擅腰、高德地圖等三十多種地圖數(shù)據(jù)蟋恬,并可以做到實(shí)時(shí)糾偏。

影像糾偏
視頻融合

交通安防領(lǐng)域需要用到的視頻監(jiān)控趁冈、視頻融合功能歼争“萋恚可以將視頻映射到傾斜攝影、BIM模型上(3dtiles模型)沐绒,視頻會(huì)覆蓋到非平面物體上俩莽,不會(huì)出現(xiàn)閃爍等現(xiàn)象。

視頻融合
編輯交互

針對(duì)模型位置乔遮、姿態(tài)進(jìn)行編輯扮超。方便進(jìn)行多個(gè)模型數(shù)據(jù)組合使用。并且這里的模型位置編輯可以很方便的在全球任意位置拖放蹋肮。

編輯交互
建筑群泛光特效

結(jié)合CesiumLab數(shù)據(jù)生產(chǎn)出刷,使用EarthSDK調(diào)整數(shù)據(jù)后期亮度,可以做出較好的特效括尸。方便進(jìn)行大屏展示巷蚪。

建筑群泛光特效
多視口方案對(duì)比

可以指定模型數(shù)據(jù)顯示在某一個(gè)視口,方便進(jìn)行方案對(duì)比等操作濒翻。

多視口方案對(duì)比
地下模式和地表透明

Cesium的地面本身不能做到透明顯示屁柏,我們進(jìn)行改進(jìn),使得透明度可以實(shí)時(shí)調(diào)節(jié)有送。

地下模式和地表透明
視域分析

動(dòng)態(tài)實(shí)現(xiàn)視域分析效果淌喻。

視域分析
路徑編輯

可以對(duì)路徑進(jìn)行編輯,編輯好的路徑雀摘,可以用于控制相機(jī)的漫游裸删,也可以控制物體的移動(dòng)。

路徑編輯
改進(jìn)的標(biāo)簽

對(duì)原始Cesium的標(biāo)簽效果進(jìn)行改進(jìn)阵赠,并可以使用類(lèi)似html5標(biāo)簽增加onClick屬性涯塔,來(lái)自動(dòng)執(zhí)行自定義操作。

改進(jìn)的標(biāo)簽

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末清蚀,一起剝皮案震驚了整個(gè)濱河市匕荸,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌枷邪,老刑警劉巖榛搔,帶你破解...
    沈念sama閱讀 222,183評(píng)論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異东揣,居然都是意外死亡践惑,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,850評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門(mén)嘶卧,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)尔觉,“玉大人,你說(shuō)我怎么就攤上這事脸候∏钣椋” “怎么了绑蔫?”我有些...
    開(kāi)封第一講書(shū)人閱讀 168,766評(píng)論 0 361
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)泵额。 經(jīng)常有香客問(wèn)我配深,道長(zhǎng),這世上最難降的妖魔是什么嫁盲? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 59,854評(píng)論 1 299
  • 正文 為了忘掉前任篓叶,我火速辦了婚禮,結(jié)果婚禮上羞秤,老公的妹妹穿的比我還像新娘缸托。我一直安慰自己,他們只是感情好瘾蛋,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,871評(píng)論 6 398
  • 文/花漫 我一把揭開(kāi)白布俐镐。 她就那樣靜靜地躺著,像睡著了一般哺哼。 火紅的嫁衣襯著肌膚如雪佩抹。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 52,457評(píng)論 1 311
  • 那天取董,我揣著相機(jī)與錄音棍苹,去河邊找鬼。 笑死茵汰,一個(gè)胖子當(dāng)著我的面吹牛枢里,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播蹂午,決...
    沈念sama閱讀 40,999評(píng)論 3 422
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼栏豺,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了豆胸?” 一聲冷哼從身側(cè)響起冰悠,我...
    開(kāi)封第一講書(shū)人閱讀 39,914評(píng)論 0 277
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎配乱,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體皮迟,經(jīng)...
    沈念sama閱讀 46,465評(píng)論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡搬泥,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,543評(píng)論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了伏尼。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片忿檩。...
    茶點(diǎn)故事閱讀 40,675評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖爆阶,靈堂內(nèi)的尸體忽然破棺而出燥透,到底是詐尸還是另有隱情沙咏,我是刑警寧澤,帶...
    沈念sama閱讀 36,354評(píng)論 5 351
  • 正文 年R本政府宣布班套,位于F島的核電站肢藐,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏吱韭。R本人自食惡果不足惜吆豹,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,029評(píng)論 3 335
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望理盆。 院中可真熱鬧痘煤,春花似錦、人聲如沸猿规。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,514評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)姨俩。三九已至蘸拔,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間哼勇,已是汗流浹背都伪。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,616評(píng)論 1 274
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留积担,地道東北人陨晶。 一個(gè)月前我還...
    沈念sama閱讀 49,091評(píng)論 3 378
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像帝璧,于是被迫代替她去往敵國(guó)和親先誉。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,685評(píng)論 2 360

推薦閱讀更多精彩內(nèi)容