Skip to content

Commit 0905a87

Browse files
ZTongciclaude
ZTongci
and
claude
committed
refactor(viewer): expose showSkyBox from useViewerProperty to remove duplication
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
1 parent 0802fe1 commit 0905a87

3 files changed

Lines changed: 39 additions & 134 deletions

File tree

‎src/engines/Cesium/hooks.ts‎

Lines changed: 30 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -12,19 +12,8 @@ import {
1212
ShadowMap,
1313
ImageryLayer,
1414
} from "cesium";
15-
import {
16-
MutableRefObject,
17-
RefObject,
18-
useCallback,
19-
useEffect,
20-
useMemo,
21-
useRef,
22-
} from "react";
23-
import type {
24-
CesiumComponentRef,
25-
CesiumMovementEvent,
26-
RootEventTarget,
27-
} from "resium";
15+
import { MutableRefObject, RefObject, useCallback, useEffect, useMemo, useRef } from "react";
16+
import type { CesiumComponentRef, CesiumMovementEvent, RootEventTarget } from "resium";
2817

2918
import type {
3019
LayerSelectionReason,
@@ -35,13 +24,7 @@ import type {
3524
LayerVisibilityEvent,
3625
} from "..";
3726
import { e2eAccessToken, setE2ECesiumViewer } from "../../e2eConfig";
38-
import {
39-
ComputedFeature,
40-
DataType,
41-
SelectedFeatureInfo,
42-
LatLng,
43-
Camera,
44-
} from "../../mantle";
27+
import { ComputedFeature, DataType, SelectedFeatureInfo, LatLng, Camera } from "../../mantle";
4528
import {
4629
Credits,
4730
CustomProviderConfig,
@@ -77,10 +60,7 @@ interface CustomGlobeSurface {
7760
};
7861
}
7962

80-
type CesiumMouseEvent = (
81-
movement: CesiumMovementEvent,
82-
target: RootEventTarget,
83-
) => void;
63+
type CesiumMouseEvent = (movement: CesiumMovementEvent, target: RootEventTarget) => void;
8464
type CesiumMouseWheelEvent = (delta: number) => void;
8565

8666
export default ({
@@ -139,11 +119,7 @@ export default ({
139119
options?: LayerSelectionReason,
140120
info?: SelectedFeatureInfo,
141121
) => void;
142-
onLayerDrag?: (
143-
layerId: string,
144-
featureId: string | undefined,
145-
position: LatLng,
146-
) => void;
122+
onLayerDrag?: (layerId: string, featureId: string | undefined, position: LatLng) => void;
147123
onLayerDrop?: (
148124
layerId: string,
149125
featureId: string | undefined,
@@ -201,12 +177,10 @@ export default ({
201177
})
202178
| undefined;
203179
if (!shadowMap) return;
204-
shadowMap.softShadows =
205-
property?.scene?.shadow?.shadowMap?.softShadows ?? false;
180+
shadowMap.softShadows = property?.scene?.shadow?.shadowMap?.softShadows ?? false;
206181
shadowMap.darkness = property?.scene?.shadow?.shadowMap?.darkness ?? 0.3;
207182
shadowMap.size = property?.scene?.shadow?.shadowMap?.size ?? 2048;
208-
shadowMap.maximumDistance =
209-
property?.scene?.shadow?.shadowMap?.maximumDistance ?? 5000;
183+
shadowMap.maximumDistance = property?.scene?.shadow?.shadowMap?.maximumDistance ?? 5000;
210184
shadowMap.fadingEnabled = true;
211185
shadowMap.normalOffset = true;
212186

@@ -319,7 +293,7 @@ export default ({
319293
// Find ImageryLayerFeature
320294
const ImageryLayerDataTypes: DataType[] = [];
321295
const layers = layersRef?.current?.findAll(
322-
(layer) =>
296+
layer =>
323297
layer.type === "simple" &&
324298
!!layer.data?.type &&
325299
ImageryLayerDataTypes.includes(layer.data?.type),
@@ -331,7 +305,7 @@ export default ({
331305
((): [ComputedFeature, string] | void => {
332306
for (const layer of layers) {
333307
const f = layer.computed?.features.find(
334-
(feature) => feature.id !== selectedLayerId?.featureId,
308+
feature => feature.id !== selectedLayerId?.featureId,
335309
);
336310
if (f) {
337311
return [f, layer.id];
@@ -370,9 +344,7 @@ export default ({
370344

371345
if (entity) {
372346
const layer = tag?.layerId
373-
? (layersRef?.current
374-
?.overriddenLayers()
375-
.find((l) => l.id === tag.layerId) ??
347+
? (layersRef?.current?.overriddenLayers().find(l => l.id === tag.layerId) ??
376348
layersRef?.current?.findById(tag.layerId))
377349
: undefined;
378350
// Sometimes only featureId is specified, so we need to sync entity tag.
@@ -385,11 +357,8 @@ export default ({
385357
title: entity.name,
386358
content: getEntityContent(
387359
entity,
388-
cesium.current?.cesiumElement?.clock.currentTime ??
389-
new JulianDate(),
390-
tag?.layerId
391-
? layer?.infobox?.property?.defaultContent
392-
: undefined,
360+
cesium.current?.cesiumElement?.clock.currentTime ?? new JulianDate(),
361+
tag?.layerId ? layer?.infobox?.property?.defaultContent : undefined,
393362
),
394363
},
395364
}
@@ -423,19 +392,15 @@ export default ({
423392
});
424393

425394
const handleMouseEvent = useCallback(
426-
(
427-
type: keyof MouseEvents,
428-
e: CesiumMovementEvent,
429-
target: RootEventTarget,
430-
) => {
395+
(type: keyof MouseEvents, e: CesiumMovementEvent, target: RootEventTarget) => {
431396
if (engineAPI.mouseEventCallbacks[type]?.length > 0) {
432397
const viewer = cesium.current?.cesiumElement;
433398
if (!viewer || viewer.isDestroyed()) return;
434399
const props = makeMouseEventProps(viewer, e);
435400
if (!props) return;
436401
const layerId = getLayerId(target);
437402
if (layerId) props.layerId = layerId;
438-
engineAPI.mouseEventCallbacks[type].forEach((cb) => cb(props));
403+
engineAPI.mouseEventCallbacks[type].forEach(cb => cb(props));
439404
}
440405
},
441406
[engineAPI],
@@ -444,7 +409,7 @@ export default ({
444409
const handleMouseWheel = useCallback(
445410
(delta: number) => {
446411
if (engineAPI.mouseEventCallbacks.wheel.length > 0) {
447-
engineAPI.mouseEventCallbacks.wheel.forEach((cb) => cb({ delta }));
412+
engineAPI.mouseEventCallbacks.wheel.forEach(cb => cb({ delta }));
448413
}
449414
},
450415
[engineAPI],
@@ -473,12 +438,9 @@ export default ({
473438
handleMouseWheel(delta);
474439
},
475440
};
476-
(Object.keys(mouseEvents) as (keyof MouseEvents)[]).forEach((type) => {
441+
(Object.keys(mouseEvents) as (keyof MouseEvents)[]).forEach(type => {
477442
if (type !== "wheel")
478-
mouseEvents[type] = (
479-
e: CesiumMovementEvent,
480-
target: RootEventTarget,
481-
) => {
443+
mouseEvents[type] = (e: CesiumMovementEvent, target: RootEventTarget) => {
482444
handleMouseEvent(type as keyof MouseEvents, e, target);
483445
};
484446
});
@@ -507,17 +469,10 @@ export default ({
507469
viewer.selectedEntity = undefined;
508470
}
509471

510-
if (
511-
target &&
512-
"id" in target &&
513-
target.id instanceof Entity &&
514-
isSelectable(target.id)
515-
) {
472+
if (target && "id" in target && target.id instanceof Entity && isSelectable(target.id)) {
516473
const tag = getTag(target.id);
517474
const layer = tag?.layerId
518-
? (layersRef?.current
519-
?.overriddenLayers()
520-
.find((l) => l.id === tag.layerId) ??
475+
? (layersRef?.current?.overriddenLayers().find(l => l.id === tag.layerId) ??
521476
layersRef?.current?.findById(tag.layerId))
522477
: undefined;
523478
onLayerSelect?.(
@@ -530,9 +485,7 @@ export default ({
530485
content: getEntityContent(
531486
target.id,
532487
viewer.clock.currentTime ?? new JulianDate(),
533-
tag?.layerId
534-
? layer?.infobox?.property?.defaultContent
535-
: undefined,
488+
tag?.layerId ? layer?.infobox?.property?.defaultContent : undefined,
536489
),
537490
},
538491
}
@@ -549,8 +502,7 @@ export default ({
549502

550503
if (
551504
target &&
552-
(target instanceof Cesium3DTileFeature ||
553-
target instanceof Cesium3DTilePointFeature)
505+
(target instanceof Cesium3DTileFeature || target instanceof Cesium3DTilePointFeature)
554506
) {
555507
const tag = getTag(target);
556508
if (tag) {
@@ -595,8 +547,7 @@ export default ({
595547

596548
if (
597549
target?.primitive &&
598-
(target.primitive instanceof Primitive ||
599-
target.primitive instanceof GroundPrimitive)
550+
(target.primitive instanceof Primitive || target.primitive instanceof GroundPrimitive)
600551
) {
601552
const primitive = target.primitive;
602553
const tag = getTag(primitive);
@@ -614,26 +565,17 @@ export default ({
614565
const pickRay = scene.camera.getPickRay(e.position);
615566

616567
if (pickRay) {
617-
const l = await scene.imageryLayers.pickImageryLayerFeatures(
618-
pickRay,
619-
scene,
620-
);
568+
const l = await scene.imageryLayers.pickImageryLayerFeatures(pickRay, scene);
621569

622570
// Find the topmost overlaid feature.
623-
const f = l?.findLast((f) => {
571+
const f = l?.findLast(f => {
624572
const appearanceType = f?.data?.appearanceType;
625-
return (
626-
appearanceType &&
627-
f?.data?.feature?.[appearanceType]?.show !== false
628-
);
573+
return appearanceType && f?.data?.feature?.[appearanceType]?.show !== false;
629574
});
630575

631576
const appearanceType = f?.data?.appearanceType;
632577

633-
if (
634-
appearanceType &&
635-
f?.data?.feature?.[appearanceType]?.show !== false
636-
) {
578+
if (appearanceType && f?.data?.feature?.[appearanceType]?.show !== false) {
637579
const tag = getTag(f.imageryLayer);
638580

639581
const pos = f.position;
@@ -652,17 +594,13 @@ export default ({
652594
}
653595

654596
const layer = tag?.layerId
655-
? (layersRef?.current
656-
?.overriddenLayers()
657-
.find((l) => l.id === tag.layerId) ??
597+
? (layersRef?.current?.overriddenLayers().find(l => l.id === tag.layerId) ??
658598
layersRef?.current?.findById(tag.layerId))
659599
: undefined;
660600
const content = getEntityContent(
661601
f.data.feature ?? f,
662602
viewer.clock.currentTime ?? new JulianDate(),
663-
tag?.layerId
664-
? layer?.infobox?.property?.defaultContent
665-
: undefined,
603+
tag?.layerId ? layer?.infobox?.property?.defaultContent : undefined,
666604
);
667605
prevSelectedImageryFeatureId.current = f.data.featureId;
668606
onLayerSelect?.(
@@ -773,8 +711,7 @@ export default ({
773711
if (globe) {
774712
const surface = (globe as any)._surface as CustomGlobeSurface;
775713
if (surface) {
776-
surface.tileProvider._debug.wireframe =
777-
property?.debug?.showGlobeWireframe ?? false;
714+
surface.tileProvider._debug.wireframe = property?.debug?.showGlobeWireframe ?? false;
778715
}
779716
}
780717
}, [property?.debug?.showGlobeWireframe]);
@@ -795,13 +732,7 @@ export default ({
795732
});
796733
}, [time, timelineManagerRef]);
797734

798-
const {
799-
sceneLight,
800-
sceneBackgroundColor,
801-
sceneMsaaSamples,
802-
sceneMode,
803-
showSkyBox,
804-
} = useViewerProperty({
735+
const { sceneLight, sceneBackgroundColor, sceneMsaaSamples, sceneMode, showSkyBox } = useViewerProperty({
805736
property,
806737
cesium,
807738
});

‎src/engines/Cesium/hooks/useViewerProperty.ts‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,4 @@
1-
import {
2-
Cartesian3,
3-
Color,
4-
DirectionalLight,
5-
SceneMode,
6-
SunLight,
7-
Viewer,
8-
} from "cesium";
1+
import { Cartesian3, Color, DirectionalLight, SceneMode, SunLight, Viewer } from "cesium";
92
import { RefObject, useEffect, useMemo } from "react";
103
import { CesiumComponentRef } from "resium";
114

‎src/engines/Cesium/index.tsx‎

Lines changed: 8 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,4 @@
1-
import {
2-
ArcType,
3-
Color,
4-
KeyboardEventModifier,
5-
ScreenSpaceEventType,
6-
} from "cesium";
1+
import { ArcType, Color, KeyboardEventModifier, ScreenSpaceEventType } from "cesium";
72
import React, { forwardRef } from "react";
83
import {
94
Viewer,
@@ -32,10 +27,7 @@ import LabelImageryLayers from "./core/labels/LabelImageryLayers";
3227
import Event from "./Event";
3328
import Feature, { context as featureContext } from "./Feature";
3429
import useHooks from "./hooks";
35-
import {
36-
AmbientOcclusion,
37-
AmbientOcclusionOutputType,
38-
} from "./PostProcesses/hbao";
30+
import { AmbientOcclusion, AmbientOcclusionOutputType } from "./PostProcesses/hbao";
3931
import { AMBIENT_OCCLUSION_QUALITY } from "./PostProcesses/hbao/config";
4032
import Sketch from "./Sketch";
4133

@@ -178,8 +170,7 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
178170
onMouseEnter={mouseEventHandles.mouseEnter}
179171
onMouseLeave={mouseEventHandles.mouseLeave}
180172
onWheel={mouseEventHandles.wheel}
181-
automaticallyTrackDataSourceClocks={false}
182-
>
173+
automaticallyTrackDataSourceClocks={false}>
183174
<Event onMount={handleMount} onUnmount={handleUnmount} />
184175
<Clock timelineManagerRef={timelineManagerRef} />
185176
<ImageryLayers
@@ -230,8 +221,7 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
230221
<ScreenSpaceCameraController
231222
maximumZoomDistance={
232223
property?.camera?.limiter?.enabled
233-
? (property.camera?.limiter?.targetArea?.height ??
234-
Number.POSITIVE_INFINITY)
224+
? (property.camera?.limiter?.targetArea?.height ?? Number.POSITIVE_INFINITY)
235225
: Number.POSITIVE_INFINITY
236226
}
237227
enableCollisionDetection={!property?.camera?.allowEnterGround}
@@ -269,16 +259,11 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
269259
useDepthPicking={true}
270260
useWebVR={!!property?.scene?.vr || undefined} // NOTE: useWebVR={false} will crash Cesium
271261
debugShowFramesPerSecond={!!property?.debug?.showFramesPerSecond}
272-
verticalExaggerationRelativeHeight={
273-
property?.scene?.verticalExaggerationRelativeHeight
274-
}
262+
verticalExaggerationRelativeHeight={property?.scene?.verticalExaggerationRelativeHeight}
275263
verticalExaggeration={verticalExaggeration}
276264
/>
277265
<SkyBox show={showSkyBox} />
278-
<Fog
279-
enabled={property?.sky?.fog?.enabled ?? true}
280-
density={property?.sky?.fog?.density}
281-
/>
266+
<Fog enabled={property?.sky?.fog?.enabled ?? true} density={property?.sky?.fog?.density} />
282267
<Sun show={property?.sky?.sun?.show ?? true} />
283268
<Moon show={property?.sky?.moon?.show ?? true} />
284269
<SkyAtmosphere
@@ -292,13 +277,9 @@ const Cesium: React.ForwardRefRenderFunction<EngineRef, EngineProps> = (
292277
cesiumIonAccessToken={cesiumIonAccessToken}
293278
onTerrainProviderChange={handleTerrainProviderChange}
294279
/>
295-
<featureContext.Provider value={context}>
296-
{ready ? children : null}
297-
</featureContext.Provider>
280+
<featureContext.Provider value={context}>{ready ? children : null}</featureContext.Provider>
298281
<AmbientOcclusion
299-
{...AMBIENT_OCCLUSION_QUALITY[
300-
property?.render?.ambientOcclusion?.quality || "low"
301-
]}
282+
{...AMBIENT_OCCLUSION_QUALITY[property?.render?.ambientOcclusion?.quality || "low"]}
302283
enabled={!!property?.render?.ambientOcclusion?.enabled}
303284
intensity={property?.render?.ambientOcclusion?.intensity ?? 100}
304285
outputType={

0 commit comments

Comments
 (0)