Skip to content

Commit 4bd8ae8

Browse files
authored
Merge pull request #6877 from AnalyticalGraphicsInc/atmosphere
Add ground atmosphere
2 parents b73152b + b75d1cf commit 4bd8ae8

10 files changed

+440
-84
lines changed
+174
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,174 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
7+
<meta name="description" content="Adjust hue, saturation, and brightness of the sky/atmosphere.">
8+
<meta name="cesium-sandcastle-labels" content="Showcases">
9+
<title>Cesium Demo</title>
10+
<script type="text/javascript" src="../Sandcastle-header.js"></script>
11+
<script type="text/javascript" src="../../../ThirdParty/requirejs-2.1.20/require.js"></script>
12+
<script type="text/javascript">
13+
require.config({
14+
baseUrl : '../../../Source',
15+
waitSeconds : 60
16+
});
17+
</script>
18+
</head>
19+
<body class="sandcastle-loading" data-sandcastle-bucket="bucket-requirejs.html">
20+
<style>
21+
@import url(../templates/bucket.css);
22+
#toolbar {
23+
background: rgba(42, 42, 42, 0.8);
24+
padding: 4px;
25+
border-radius: 4px;
26+
}
27+
#toolbar input {
28+
vertical-align: middle;
29+
padding-top: 2px;
30+
padding-bottom: 2px;
31+
}
32+
</style>
33+
<div id="cesiumContainer" class="fullSize"></div>
34+
<div id="loadingOverlay"><h1>Loading...</h1></div>
35+
<div id="toolbar">
36+
<table><tbody>
37+
<tr>
38+
<td>Lighting Fade Out Distance</td>
39+
<td>
40+
<input type="range" min="1e6" max="1e8" step="1e6" data-bind="value: lightingFadeOutDistance, valueUpdate: 'input'">
41+
<input type="text" size="10" data-bind="value: lightingFadeOutDistance">
42+
</td>
43+
</tr>
44+
<tr>
45+
<td>Lighting Fade In Distance</td>
46+
<td>
47+
<input type="range" min="1e6" max="1e8" step="1e6" data-bind="value: lightingFadeInDistance, valueUpdate: 'input'">
48+
<input type="text" size="10" data-bind="value: lightingFadeInDistance">
49+
</td>
50+
</tr>
51+
<tr>
52+
<td>Night Fade Out Distance</td>
53+
<td>
54+
<input type="range" min="1e6" max="1e8" step="1e6" data-bind="value: nightFadeOutDistance, valueUpdate: 'input'">
55+
<input type="text" size="10" data-bind="value: nightFadeOutDistance">
56+
</td>
57+
</tr>
58+
<tr>
59+
<td>Night Fade In Distance</td>
60+
<td>
61+
<input type="range" min="1e6" max="1e8" step="1e6" data-bind="value: nightFadeInDistance, valueUpdate: 'input'">
62+
<input type="text" size="10" data-bind="value: nightFadeInDistance">
63+
</td>
64+
</tr>
65+
</tbody></table>
66+
</div>
67+
<script id="cesium_sandcastle_script">
68+
function startup(Cesium) {
69+
'use strict';
70+
//Sandcastle_Begin
71+
var viewer = new Cesium.Viewer('cesiumContainer', {
72+
sceneModePicker:false
73+
});
74+
var scene = viewer.scene;
75+
var globe = scene.globe;
76+
77+
var defaultLightFadeOut = globe.lightingFadeOutDistance;
78+
var defaultLightFadeIn = globe.lightingFadeInDistance;
79+
var defaultNightFadeOut = globe.nightFadeOutDistance;
80+
var defaultNightFadeIn = globe.nightFadeInDistance;
81+
82+
// The viewModel tracks the state of our mini application.
83+
var viewModel = {
84+
lightingFadeOutDistance : defaultLightFadeOut,
85+
lightingFadeInDistance : defaultLightFadeIn,
86+
nightFadeOutDistance : defaultNightFadeOut,
87+
nightFadeInDistance : defaultNightFadeIn
88+
};
89+
// Convert the viewModel members into knockout observables.
90+
Cesium.knockout.track(viewModel);
91+
92+
// Bind the viewModel to the DOM elements of the UI that call for it.
93+
var toolbar = document.getElementById('toolbar');
94+
Cesium.knockout.applyBindings(viewModel, toolbar);
95+
96+
// Make the skyAtmosphere's HSB parameters subscribers of the viewModel.
97+
function subscribeParameter(name) {
98+
Cesium.knockout.getObservable(viewModel, name).subscribe(
99+
function(newValue) {
100+
globe[name] = newValue;
101+
}
102+
);
103+
}
104+
105+
subscribeParameter('lightingFadeOutDistance');
106+
subscribeParameter('lightingFadeInDistance');
107+
subscribeParameter('nightFadeOutDistance');
108+
subscribeParameter('nightFadeInDistance');
109+
110+
Sandcastle.addToggleButton('Ground atmosphere', globe.showGroundAtmosphere, function(checked) {
111+
globe.showGroundAtmosphere = checked;
112+
});
113+
114+
Sandcastle.addToggleButton('Lighting', globe.enableLighting, function(checked) {
115+
globe.enableLighting = checked;
116+
});
117+
118+
Sandcastle.addToolbarMenu([{
119+
text : 'Cesium World Terrain - no effects',
120+
onselect : function() {
121+
viewer.terrainProvider = Cesium.createWorldTerrain();
122+
}
123+
}, {
124+
text : 'Cesium World Terrain w/ Vertex Normals',
125+
onselect : function() {
126+
viewer.terrainProvider = Cesium.createWorldTerrain({
127+
requestVertexNormals : true
128+
});
129+
}
130+
}, {
131+
text : 'Cesium World Terrain w/ Water',
132+
onselect : function() {
133+
viewer.terrainProvider = Cesium.createWorldTerrain({
134+
requestWaterMask : true
135+
});
136+
}
137+
}, {
138+
text : 'Cesium World Terrain w/ Vertex Normals and Water',
139+
onselect : function() {
140+
viewer.terrainProvider = Cesium.createWorldTerrain({
141+
requestVertexNormals : true,
142+
requestWaterMask : true
143+
});
144+
}
145+
}, {
146+
text : 'EllipsoidTerrainProvider',
147+
onselect : function() {
148+
viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider();
149+
}
150+
}]);
151+
152+
Sandcastle.addToolbarButton('Reset Fade Distances', function() {
153+
globe.lightingFadeOutDistance = defaultLightFadeOut;
154+
globe.lightingFadeInDistance = defaultLightFadeIn;
155+
globe.nightFadeOutDistance = defaultNightFadeOut;
156+
globe.nightFadeInDistance = defaultNightFadeIn;
157+
158+
viewModel.lightingFadeOutDistance = defaultLightFadeOut;
159+
viewModel.lightingFadeInDistance = defaultLightFadeIn;
160+
viewModel.nightFadeOutDistance = defaultNightFadeOut;
161+
viewModel.nightFadeInDistance = defaultNightFadeIn;
162+
});
163+
164+
//Sandcastle_End
165+
Sandcastle.finishedLoading();
166+
}
167+
if (typeof Cesium !== 'undefined') {
168+
startup(Cesium);
169+
} else if (typeof require === 'function') {
170+
require(['Cesium'], startup);
171+
}
172+
</script>
173+
</body>
174+
</html>
16 KB
Loading

CHANGES.md

+2
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ Change Log
1818
* Update [gltf-pipeline](https://github.com/AnalyticalGraphicsInc/gltf-pipeline/) to 2.0. [#6805](https://github.com/AnalyticalGraphicsInc/cesium/pull/6805)
1919
* Added `cartographicLimitRectangle` to `Globe`. Use this to limit terrain and imagery to a specific `Rectangle` area. [#6987](https://github.com/AnalyticalGraphicsInc/cesium/pull/6987)
2020
* Added `OpenCageGeocoderService`, which provides geocoding via [OpenCage](https://opencagedata.com/). [#7015](https://github.com/AnalyticalGraphicsInc/cesium/pull/7015)
21+
* Added ground atmosphere lighting in 3D. This can be toggled with `Globe.showGroundAtmosphere`. [6877](https://github.com/AnalyticalGraphicsInc/cesium/pull/6877)
22+
* Added `Globe.nightFadeOutDistance` and `Globe.nightFadeInDistance` to configure when ground atmosphere night lighting fades in and out. [6877](https://github.com/AnalyticalGraphicsInc/cesium/pull/6877)
2123

2224
##### Fixes :wrench:
2325
* Fixed picking for overlapping translucent primitives. [#7039](https://github.com/AnalyticalGraphicsInc/cesium/pull/7039)

Source/Scene/Globe.js

+40-12
Original file line numberDiff line numberDiff line change
@@ -131,27 +131,53 @@ define([
131131
* Enable lighting the globe with the sun as a light source.
132132
*
133133
* @type {Boolean}
134-
* @default false
134+
* @default true
135135
*/
136136
this.enableLighting = false;
137137

138+
/**
139+
* Enable the ground atmosphere.
140+
*
141+
* @type {Boolean}
142+
* @default true
143+
*/
144+
this.showGroundAtmosphere = true;
145+
138146
/**
139147
* The distance where everything becomes lit. This only takes effect
140148
* when <code>enableLighting</code> is <code>true</code>.
141149
*
142150
* @type {Number}
143-
* @default 6500000.0
151+
* @default 10000000.0
144152
*/
145-
this.lightingFadeOutDistance = 6500000.0;
153+
this.lightingFadeOutDistance = 1.0e7;
146154

147155
/**
148156
* The distance where lighting resumes. This only takes effect
149157
* when <code>enableLighting</code> is <code>true</code>.
150158
*
151159
* @type {Number}
152-
* @default 9000000.0
160+
* @default 20000000.0
161+
*/
162+
this.lightingFadeInDistance = 2.0e7;
163+
164+
/**
165+
* The distance where the darkness of night from the ground atmosphere fades out to a lit ground atmosphere.
166+
* This only takes effect when <code>showGroundAtmosphere</code> and <code>enableLighting</code> are <code>true</code>.
167+
*
168+
* @type {Number}
169+
* @default 10000000.0
170+
*/
171+
this.nightFadeOutDistance = 1.0e7;
172+
173+
/**
174+
* The distance where the darkness of night from the ground atmosphere fades in to an unlit ground atmosphere.
175+
* This only takes effect when <code>showGroundAtmosphere</code> and <code>enableLighting</code> are <code>true</code>.
176+
*
177+
* @type {Number}
178+
* @default 50000000.0
153179
*/
154-
this.lightingFadeInDistance = 9000000.0;
180+
this.nightFadeInDistance = 5.0e7;
155181

156182
/**
157183
* True if an animated wave effect should be shown in areas of the globe
@@ -187,7 +213,7 @@ define([
187213
this.shadows = ShadowMode.RECEIVE_ONLY;
188214

189215
this._oceanNormalMap = undefined;
190-
this._zoomedOutOceanSpecularIntensity = 0.5;
216+
this._zoomedOutOceanSpecularIntensity = undefined;
191217
}
192218

193219
defineProperties(Globe.prototype, {
@@ -372,7 +398,7 @@ define([
372398

373399
var requireNormals = defined(globe._material) && (globe._material.shaderSource.match(/slope/) || globe._material.shaderSource.match('normalEC'));
374400

375-
var fragmentSources = [];
401+
var fragmentSources = [GroundAtmosphere];
376402
if (defined(globe._material) && (!requireNormals || globe._terrainProvider.requestVertexNormals)) {
377403
fragmentSources.push(globe._material.shaderSource);
378404
defines.push('APPLY_MATERIAL');
@@ -640,11 +666,10 @@ define([
640666
var mode = frameState.mode;
641667

642668
if (pass.render) {
643-
// Don't show the ocean specular highlights when zoomed out in 2D and Columbus View.
644-
if (mode === SceneMode.SCENE3D) {
645-
this._zoomedOutOceanSpecularIntensity = 0.5;
669+
if (this.showGroundAtmosphere) {
670+
this._zoomedOutOceanSpecularIntensity = 0.4;
646671
} else {
647-
this._zoomedOutOceanSpecularIntensity = 0.0;
672+
this._zoomedOutOceanSpecularIntensity = 0.5;
648673
}
649674

650675
surface.maximumScreenSpaceError = this.maximumScreenSpaceError;
@@ -653,10 +678,13 @@ define([
653678
tileProvider.terrainProvider = this.terrainProvider;
654679
tileProvider.lightingFadeOutDistance = this.lightingFadeOutDistance;
655680
tileProvider.lightingFadeInDistance = this.lightingFadeInDistance;
656-
tileProvider.zoomedOutOceanSpecularIntensity = this._zoomedOutOceanSpecularIntensity;
681+
tileProvider.nightFadeOutDistance = this.nightFadeOutDistance;
682+
tileProvider.nightFadeInDistance = this.nightFadeInDistance;
683+
tileProvider.zoomedOutOceanSpecularIntensity = mode === SceneMode.SCENE3D ? this._zoomedOutOceanSpecularIntensity : 0.0;
657684
tileProvider.hasWaterMask = hasWaterMask;
658685
tileProvider.oceanNormalMap = this._oceanNormalMap;
659686
tileProvider.enableLighting = this.enableLighting;
687+
tileProvider.showGroundAtmosphere = this.showGroundAtmosphere;
660688
tileProvider.shadows = this.shadows;
661689

662690
surface.beginFrame(frameState);

Source/Scene/GlobeSurfaceShaderSet.js

+41-9
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,29 @@ define([
6666
return useWebMercatorProjection ? get2DYPositionFractionMercatorProjection : get2DYPositionFractionGeographicProjection;
6767
}
6868

69-
GlobeSurfaceShaderSet.prototype.getShaderProgram = function(frameState, surfaceTile, numberOfDayTextures, applyBrightness, applyContrast, applyHue, applySaturation, applyGamma, applyAlpha, applySplit, showReflectiveOcean, showOceanWaves, enableLighting, hasVertexNormals, useWebMercatorProjection, enableFog, enableClippingPlanes, clippingPlanes, clippedByBoundaries) {
69+
GlobeSurfaceShaderSet.prototype.getShaderProgram = function(options) {
70+
var frameState = options.frameState;
71+
var surfaceTile = options.surfaceTile;
72+
var numberOfDayTextures = options.numberOfDayTextures;
73+
var applyBrightness = options.applyBrightness;
74+
var applyContrast = options.applyContrast;
75+
var applyHue = options.applyHue;
76+
var applySaturation = options.applySaturation;
77+
var applyGamma = options.applyGamma;
78+
var applyAlpha = options.applyAlpha;
79+
var applySplit = options.applySplit;
80+
var showReflectiveOcean = options.showReflectiveOcean;
81+
var showOceanWaves = options.showOceanWaves;
82+
var enableLighting = options.enableLighting;
83+
var showGroundAtmosphere = options.showGroundAtmosphere;
84+
var perFragmentGroundAtmosphere = options.perFragmentGroundAtmosphere;
85+
var hasVertexNormals = options.hasVertexNormals;
86+
var useWebMercatorProjection = options.useWebMercatorProjection;
87+
var enableFog = options.enableFog;
88+
var enableClippingPlanes = options.enableClippingPlanes;
89+
var clippingPlanes = options.clippingPlanes;
90+
var clippedByBoundaries = options.clippedByBoundaries;
91+
7092
var quantization = 0;
7193
var quantizationDefine = '';
7294

@@ -102,14 +124,16 @@ define([
102124
(showReflectiveOcean << 8) |
103125
(showOceanWaves << 9) |
104126
(enableLighting << 10) |
105-
(hasVertexNormals << 11) |
106-
(useWebMercatorProjection << 12) |
107-
(enableFog << 13) |
108-
(quantization << 14) |
109-
(applySplit << 15) |
110-
(enableClippingPlanes << 16) |
111-
(vertexLogDepth << 17) |
112-
(cartographicLimitRectangleFlag << 18);
127+
(showGroundAtmosphere << 11) |
128+
(perFragmentGroundAtmosphere << 12) |
129+
(hasVertexNormals << 13) |
130+
(useWebMercatorProjection << 14) |
131+
(enableFog << 15) |
132+
(quantization << 16) |
133+
(applySplit << 17) |
134+
(enableClippingPlanes << 18) |
135+
(vertexLogDepth << 19) |
136+
(cartographicLimitRectangleFlag << 20);
113137

114138
var currentClippingShaderState = 0;
115139
if (defined(clippingPlanes)) {
@@ -180,6 +204,14 @@ define([
180204
}
181205
}
182206

207+
if (showGroundAtmosphere) {
208+
vs.defines.push('GROUND_ATMOSPHERE');
209+
fs.defines.push('GROUND_ATMOSPHERE');
210+
if (perFragmentGroundAtmosphere) {
211+
fs.defines.push('PER_FRAGMENT_GROUND_ATMOSPHERE');
212+
}
213+
}
214+
183215
vs.defines.push('INCLUDE_WEB_MERCATOR_Y');
184216
fs.defines.push('INCLUDE_WEB_MERCATOR_Y');
185217

0 commit comments

Comments
 (0)