chore(web): add some atmosphere properties (#663)

reearth · Sep 6, 2023 · caee550 · caee550
1 parent 9972e66
commit caee550
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 3 deletions.
diff --git a/web/src/beta/lib/core/Map/types/index.ts b/web/src/beta/lib/core/Map/types/index.ts
@@ -288,20 +288,25 @@ export type SceneProperty = {
   terrain?: TerrainProperty;
   atmosphere?: {
     enable_sun?: boolean;
+    enableMoon?: boolean;
     enable_lighting?: boolean;
     ground_atmosphere?: boolean;
     sky_atmosphere?: boolean;
     shadows?: boolean;
     shadowResolution?: 1024 | 2048 | 4096;
     softShadow?: boolean;
     shadowDarkness?: number;
+    shadowMaximumDistance?: number;
     fog?: boolean;
     fog_density?: number;
-    brightness_shift?: number;
     hue_shift?: number;
+    brightness_shift?: number;
     surturation_shift?: number;
+    skyboxBrightnessShift?: number;
+    skyboxSurturationShift?: number;
     globeShadowDarkness?: number;
     globeImageBasedLighting?: boolean;
+    globeBaseColor?: string;
   };
   timeline?: {
     animation?: boolean;

diff --git a/web/src/beta/lib/core/engines/Cesium/core/Globe.tsx b/web/src/beta/lib/core/engines/Cesium/core/Globe.tsx
@@ -12,6 +12,7 @@ import { Globe as CesiumGlobe } from "resium";
 import { objKeys } from "@reearth/beta/utils/util";
 
 import type { SceneProperty, TerrainProperty } from "../..";
+import { toColor } from "../common";
 
 export type Props = {
   property?: SceneProperty;
@@ -49,8 +50,14 @@ export default function Globe({ property, cesiumIonAccessToken }: Props): JSX.El
     cesiumIonAccessToken,
   ]);
 
+  const baseColor = useMemo(
+    () => toColor(property?.atmosphere?.globeBaseColor),
+    [property?.atmosphere?.globeBaseColor],
+  );
+
   return (
     <CesiumGlobe
+      baseColor={baseColor}
       enableLighting={!!property?.atmosphere?.enable_lighting}
       showGroundAtmosphere={property?.atmosphere?.ground_atmosphere ?? true}
       atmosphereSaturationShift={property?.atmosphere?.surturation_shift}

diff --git a/web/src/beta/lib/core/engines/Cesium/hooks.ts b/web/src/beta/lib/core/engines/Cesium/hooks.ts
@@ -166,7 +166,7 @@ export default ({
     shadowMap.darkness = property?.atmosphere?.shadowDarkness ?? 0.3;
     shadowMap.size = property?.atmosphere?.shadowResolution ?? 2048;
     shadowMap.fadingEnabled = true;
-    shadowMap.maximumDistance = 5000;
+    shadowMap.maximumDistance = property?.atmosphere?.shadowMaximumDistance ?? 5000;
     shadowMap.normalOffset = true;
 
     // bias
@@ -222,6 +222,7 @@ export default ({
     property?.atmosphere?.softShadow,
     property?.atmosphere?.shadowDarkness,
     property?.atmosphere?.shadowResolution,
+    property?.atmosphere?.shadowMaximumDistance,
   ]);
 
   useEffect(() => {

diff --git a/web/src/beta/lib/core/engines/Cesium/index.tsx b/web/src/beta/lib/core/engines/Cesium/index.tsx
@@ -13,6 +13,7 @@ import {
   ScreenSpaceCameraController,
   Entity,
   PolylineGraphics,
+  Moon,
 } from "resium";
 
 import type { Engine, EngineProps, EngineRef } from "..";
@@ -193,7 +194,12 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
         density={property?.atmosphere?.fog_density}
       />
       <Sun show={property?.atmosphere?.enable_sun ?? true} />
-      <SkyAtmosphere show={property?.atmosphere?.sky_atmosphere ?? true} />
+      <Moon show={property?.atmosphere?.enableMoon} />
+      <SkyAtmosphere
+        show={property?.atmosphere?.sky_atmosphere ?? true}
+        saturationShift={property?.atmosphere?.skyboxSurturationShift}
+        brightnessShift={property?.atmosphere?.skyboxBrightnessShift}
+      />
       <Globe property={property} cesiumIonAccessToken={cesiumIonAccessToken} />
       <featureContext.Provider value={context}>{ready ? children : null}</featureContext.Provider>
       <AmbientOcclusion