北京CBD夜景燈光特效還可以這麼美，四步教你實現！

2021-10-06 03:20:20 字數 3830 閱讀 1338

supermap iclient3d for webgl預設的光照系統，能夠滿足大多數情況下的需求。但在一些特殊的場景中，需要對場景內的光照系統進行個性化設定，這時就可以使用自定義光源來實現。本文以北京cbd夜景為例，介紹如何通過多種自定義光源來打造城市夜景燈光特效。

先來看看最終實現的北京cbd夜景燈光特效。

第一步 因為是夜景，首先關閉太陽光與環境光

scene.sun.show = false;


scene.lightsource.ambientlightcolor = new cesium.color(0, 0, 0, 1);
第二步 給場景新增乙個平行光和點光源作為底光平行光位置不限，保證整個場景都能有乙個偏藍的色調。點光源的置於重點建築群附近，提公升該區域的亮度，作為整個場景的視覺中心區域。

// 新增直射光-整個環境var dirlightoptions = ;


directionallight_v = new cesium.directionallight(position, dirlightoptions);


scene.addlightsource(directionallight_v);


// 新增點光源-整個環境var pointlightpos3 = new cesium.cartesian3.fromdegrees(116.46477932175468, 39.905807158839266, 220.0);


var pointlightoptions3 = ;


pointlight3 = new cesium.pointlight(pointlightpos3, pointlightoptions3);


scene.addlightsource(pointlight3);
第三步 依次給重點建築單獨打造燈光效果這裡以場景中的最高樓-國貿大廈為例，在其周圍新增多個點光源，並設定光源顏色為偏青藍色的冷色調。點光源的高度大致位於80公尺處，以打亮建築的中下部分。用同樣的方法給其它重點建築新增燈光效果。

// 新增點光源-最高建築var pointlightposzuigao1 = new cesium.cartesian3.fromdegrees(116.45976565628527, 39.91042009316276, 80.0);


var pointlightoptionszuigao1 = ;


pointlightzuigao1 = new cesium.pointlight(pointlightposzuigao1, pointlightoptionszuigao1);


scene.addlightsource(pointlightzuigao1);


var pointlightposzuigao2 = new cesium.cartesian3.fromdegrees(116.46059852558402, 39.91076488114754, 80.0);


pointlightzuigao2 = new cesium.pointlight(pointlightposzuigao2, pointlightoptionszuigao1);


scene.addlightsource(pointlightzuigao2);


var pointlightposzuigao3 = new cesium.cartesian3.fromdegrees(116.46058155476312, 39.9095945894333, 80.0);


pointlightzuigao3 = new cesium.pointlight(pointlightposzuigao3, pointlightoptionszuigao1);


scene.addlightsource(pointlightzuigao3);


var pointlightposzuigao4 = new cesium.cartesian3.fromdegrees(116.4615882163, 39.910460599, 80.0);


pointlightzuigao4 = new cesium.pointlight(pointlightposzuigao4, pointlightoptionszuigao1);


scene.addlightsource(pointlightzuigao4);
第四步 給道路新增路燈效果前面新增的燈光都是針對建築新增的，道路上面也會有很多的路燈。這裡我們通過聚光燈來模擬路燈的效果，因為路燈具有明顯的方向性。由於之前新增的燈光都是冷色調的，這裡給路燈設定乙個比較明顯的暖色調，平衡場景中的顏色分布。因為場景是支援hdr的，所以可以給光源顏色設定大於1的rgb值(6, 5, 0.2, 1)。另外給光源設定乙個合適的衰減係數（3），保證燈光在向周圍傳播的時候逐漸減弱。

// 新增聚光燈-橫向道路-路燈1var spotlightposludeng1_1 = new cesium.cartesian3.fromdegrees(116.46215548997236, 39.907743432631186, 30);


var spotlighttargetposludeng1_1 = new cesium.cartesian3.fromdegrees(116.46215548997236, 39.907743432631186, 0);


var spotlightotionsludeng1_1 = ;


spotlightludeng1_1 = new cesium.spotlight(spotlightposludeng1_1, spotlighttargetposludeng1_1, spotlightotionsludeng1_1);


scene.addlightsource(spotlightludeng1_1);


// 新增聚光燈-橫向道路-路燈2var spotlightposludeng1_2 = new cesium.cartesian3.fromdegrees(116.46008198437434, 39.90779904562042, 30);


var spotlighttargetposludeng1_2 = new cesium.cartesian3.fromdegrees(116.46008198437434, 39.90779904562042, 0);


spotlightludeng1_2 = new cesium.spotlight(spotlightposludeng1_2, spotlighttargetposludeng1_2, spotlightotionsludeng1_1);


scene.addlightsource(spotlightludeng1_2);


// 新增聚光燈-橫向道路-路燈3var spotlightposludeng1_3 = new cesium.cartesian3.fromdegrees(116.45718936579341, 39.907836561376094, 30);


var spotlighttargetposludeng1_3 = new cesium.cartesian3.fromdegrees(116.45718936579341, 39.907836561376094, 0);


spotlightludeng1_3 = new cesium.spotlight(spotlightposludeng1_3, spotlighttargetposludeng1_3, spotlightotionsludeng1_1);


scene.addlightsource(spotlightludeng1_3);

約在CBD，吃飯

午飯當然是外賣。cbd上班的同仁們不用約，都去了一間叫 大食堂 的餐廳。它在商業街繁華地段的二樓，有1000平公尺。你不知道麼，餐館們都躲到找不著的角落，變成了廚房，這裡的租金便宜得很。但它不做飯，只賣飲料。大門位於餐廳的中部，一進門就有一排路標 愛美區 健身區 旅遊區 才藝區 it區 噴飯區。乙個...

北京理工大學金旭亮老師C （57 CBD）

什麼是 程式集 關於 程式集 應該知道的 net程式的基本構造塊是 程式集 assembly 程式集是乙個擴充套件名為.dll或.exe的檔案 net framework中的各個類，存放在相應的程式集檔案中。如何建立乙個程式集？使用程式集 程式集和命名空間的關係 程式集的物理載體是 實實在在可以看得...

平安夜狂歡夜

平安夜狂歡夜 晚上與哥們去狂歡,費了好大的周折,才找到乙個迪吧,莛苑迪吧或者是野豹,據說是龍華最大的了,感覺比關內的魔方還好吧,哥們不會蹦,嘿嘿,第一次,都這樣,看我玩得瘋,他也慢慢地搖起來,到了十一點半左右,dj說裝置出了點問題,要暫停了,我有點納悶,接著就聽台上人說要搞乙個什麼活動,消防演習,神...