Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

chore: add idProperty to data #731

Merged
merged 2 commits into from
Oct 11, 2023
Merged

chore: add idProperty to data #731

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
bde65c9
chore: add idProperty to data
keiya01 Oct 10, 2023
963c7cb
Merge branch 'main' into feat/id-property
keiya01 Oct 11, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
82 changes: 50 additions & 32 deletions web/src/beta/lib/core/engines/Cesium/Feature/Tileset/hooks.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,9 @@ import {
ImageBasedLighting,
Cesium3DTileContent,
Color,
Viewer,
} from "cesium";
import { isEqual, pick } from "lodash-es";
import { pick } from "lodash-es";
import { MutableRefObject, useCallback, useEffect, useMemo, useRef, useState } from "react";
import { CesiumComponentRef, useCesium } from "resium";

Expand All @@ -39,7 +40,11 @@ import type {
import { layerIdField, sampleTerrainHeightFromCartesian } from "../../common";
import { arrayToCartecian3 } from "../../helpers/sphericalHaromic";
import type { InternalCesium3DTileFeature } from "../../types";
import { lookupFeatures, translationWithClamping } from "../../utils";
import {
convertCesium3DTileFeatureProperties,
lookupFeatures,
translationWithClamping,
} from "../../utils";
import { useContext } from "../context";
import {
usePick,
Expand All @@ -62,6 +67,7 @@ const useData = (layer: ComputedLayer | undefined) => {
return {
type: data?.type,
url: data?.url,
idProperty: data?.idProperty,
layers: data?.layers
? Array.isArray(data.layers)
? data.layers.join(",")
Expand All @@ -74,24 +80,27 @@ const useData = (layer: ComputedLayer | undefined) => {
const makeFeatureFrom3DTile = (
tileFeature: InternalCesium3DTileFeature,
content: Cesium3DTileContent,
): Feature => {
idProperty?: string,
): Omit<Feature, "properties"> => {
const coordinates = content.tile.boundingSphere.center;
const featureId = getBuiltinFeatureId(tileFeature);
const id = generateIDWithMD5(`${coordinates.x}-${coordinates.y}-${coordinates.z}-${featureId}`);
const properties =
tileFeature instanceof Model
? {}
: Object.fromEntries(
tileFeature.getPropertyIds().map(id => [id, tileFeature.getProperty(id)]),
);
const id = (() => {
const specifiedId =
idProperty && !(tileFeature instanceof Model)
? tileFeature.getProperty(idProperty)
: undefined;
if (specifiedId) {
return specifiedId;
}
const featureId = getBuiltinFeatureId(tileFeature);
return generateIDWithMD5(`${coordinates.x}-${coordinates.y}-${coordinates.z}-${featureId}`);
})();
return {
type: "feature",
id,
geometry: {
type: "Point",
coordinates: [coordinates.x, coordinates.y, coordinates.z],
},
properties,
range: {
x: coordinates.x,
y: coordinates.y,
Expand All @@ -105,7 +114,8 @@ const getBuiltinFeatureId = (f: InternalCesium3DTileFeature) => {
};

type CachedFeature = {
feature: Feature;
// NOTE: `properties` wastes memory, so don't pass it.
feature: Omit<Feature, "properties">;
raw: InternalCesium3DTileFeature;
};

Expand Down Expand Up @@ -150,15 +160,17 @@ const convertStyle = (val: any, convert: StyleProperty["convert"]) => {
const useFeature = ({
id,
tileset,

idProperty,
layer,
viewer,
evalFeature,
onComputedFeatureFetch,
}: {
id?: string;
tileset: MutableRefObject<Cesium3DTileset | undefined>;

idProperty?: string;
layer?: ComputedLayer;
viewer?: Viewer;
evalFeature: EvalFeature;
onComputedFeatureFetch?: (f: Feature[], cf: ComputedFeature[]) => void;
}) => {
Expand All @@ -173,8 +185,12 @@ const useFeature = ({
if (layer?.type === "simple" && feature?.feature) {
const raw = feature.raw;
const tag = getTag(raw);
const properties =
viewer && !(raw instanceof Model)
? convertCesium3DTileFeatureProperties(viewer, raw)
: {};

const computedFeature = evalFeature(layer, feature?.feature);
const computedFeature = evalFeature(layer, { ...feature?.feature, properties });

const style = computedFeature?.["3dtiles"];

Expand Down Expand Up @@ -227,7 +243,7 @@ const useFeature = ({
}
return;
},
[evalFeature, layerId],
[evalFeature, layerId, viewer],
);

useEffect(
Expand All @@ -237,24 +253,32 @@ const useFeature = ({
const features = new Set<Feature>();
await lookupFeatures(t.content, async (tileFeature, content) => {
const feature = (() => {
const normalFeature = makeFeatureFrom3DTile(tileFeature, content);
const normalFeature = makeFeatureFrom3DTile(tileFeature, content, idProperty);
const feature: CachedFeature = {
feature: normalFeature,
raw: tileFeature,
};
cachedFeaturesRef.current.push(feature);
cachedFeatureIds.current.add(normalFeature.id);
return feature;
})();

await attachComputedFeature(feature);
cachedFeaturesRef.current.push(feature);

cachedFeatureIds.current.add(feature.feature.id);

// NOTE: Don't pass a large object like `properties`.
features.add(pick(feature.feature, ["id", "type", "range"]));
});
onComputedFeatureFetch?.(Array.from(features.values()), []);
}),
[tileset, cachedFeaturesRef, attachComputedFeature, layerId, onComputedFeatureFetch],
[
tileset,
cachedFeaturesRef,
attachComputedFeature,
layerId,
onComputedFeatureFetch,
idProperty,
],
);

useEffect(() => {
Expand All @@ -270,7 +294,7 @@ const useFeature = ({
const skippedComputingAt = useRef<number | null>();
useEffect(() => {
skippedComputingAt.current = Date.now();
}, [pickedAppearance]);
}, [pickedAppearance, layer?.layer._updateStyle]);

const prevUpdateStyle = useRef(layer?.layer._updateStyle);
const computeFeatureAsync = useCallback(
Expand All @@ -282,15 +306,7 @@ const useFeature = ({
return;
}

const pickedProperties = pick(f.feature.properties, TILESET_APPEARANCE_FIELDS);
if (
pickedAppearance &&
(!isEqual(pickedProperties, pickedAppearance) ||
prevUpdateStyle.current !== layer?.layer._updateStyle)
) {
Object.entries(pickedAppearance).forEach(([k, v]) => {
f.feature.properties[k] = v;
});
if (pickedAppearance || layer?.layer._updateStyle) {
attachComputedFeature(f);
}
resolve(undefined);
Expand Down Expand Up @@ -380,7 +396,7 @@ export const useHooks = ({
allowEnterGround,
} = useClippingBox({ clipping: experimental_clipping, boxId });
const [style, setStyle] = useState<Cesium3DTileStyle>();
const { url, type } = useData(layer);
const { url, type, idProperty } = useData(layer);

const prevPlanes = useRef(_planes);
const planes = useMemo(() => {
Expand Down Expand Up @@ -434,6 +450,8 @@ export const useHooks = ({
id,
tileset: tilesetRef,
layer,
idProperty,
viewer,
evalFeature,
onComputedFeatureFetch,
});
Expand Down
37 changes: 19 additions & 18 deletions web/src/beta/lib/core/engines/Cesium/useEngineRef.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,13 @@ import {
} from "./common";
import { attachTag, getTag } from "./Feature";
import { PickedFeature, pickManyFromViewportAsFeature } from "./pickMany";
import { convertObjToComputedFeature, findEntity, findFeaturesFromLayer } from "./utils";
import {
convertCesium3DTileFeatureProperties,
convertEntityProperties,
convertObjToComputedFeature,
findEntity,
findFeaturesFromLayer,
} from "./utils";

export default function useEngineRef(
ref: Ref<EngineRef>,
Expand Down Expand Up @@ -489,16 +495,17 @@ export default function useEngineRef(
return {
type: "feature",
id: tag.featureId,
properties: entity.properties,
properties: convertEntityProperties(viewer, entity),
};
}
if (entity instanceof Cesium.Cesium3DTileFeature) {
if (
entity instanceof Cesium.Cesium3DTileFeature ||
entity instanceof Cesium.Cesium3DTilePointFeature
) {
return {
type: "feature",
id: tag.featureId,
properties: Object.fromEntries(
entity.getPropertyIds().map(key => [key, entity.getProperty(key)]),
),
properties: convertCesium3DTileFeatureProperties(viewer, entity),
};
}
return;
Expand Down Expand Up @@ -533,25 +540,19 @@ export default function useEngineRef(
tag.computedFeature ?? {
type: "computedFeature",
id: tag.featureId,
properties:
entity.properties &&
Object.fromEntries(
entity.properties.propertyNames.map(key => [
key,
entity.properties?.getValue(viewer.clock.currentTime)?.[key],
]),
),
properties: convertEntityProperties(viewer, entity),
}
);
}
if (entity instanceof Cesium.Cesium3DTileFeature) {
if (
entity instanceof Cesium.Cesium3DTileFeature ||
entity instanceof Cesium.Cesium3DTilePointFeature
) {
return (
tag.computedFeature ?? {
type: "computedFeature",
id: tag.featureId,
properties: Object.fromEntries(
entity.getPropertyIds().map(key => [key, entity.getProperty(key)]),
),
properties: convertCesium3DTileFeatureProperties(viewer, entity),
}
);
}
Expand Down
23 changes: 21 additions & 2 deletions web/src/beta/lib/core/engines/Cesium/utils.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -321,6 +321,25 @@ export function getPixelRatio(scene: Scene): number {
).pixelRatio;
}

export const convertEntityProperties = (viewer: Viewer, entity: Entity) => {
return (
entity.properties &&
Object.fromEntries(
entity.properties.propertyNames.map(key => [
key,
entity.properties?.getValue(viewer.clock.currentTime)?.[key],
]),
)
);
};

export const convertCesium3DTileFeatureProperties = (
viewer: Viewer,
feature: Cesium3DTileFeature | Cesium3DTilePointFeature,
) => {
return Object.fromEntries(feature.getPropertyIds().map(id => [id, feature.getProperty(id)]));
};

export const convertObjToComputedFeature = (
viewer: Viewer,
obj: object,
Expand All @@ -332,7 +351,7 @@ export const convertObjToComputedFeature = (
tag?.computedFeature ?? {
type: "computedFeature",
id: tag?.featureId ?? "",
properties: Object.fromEntries(obj.getPropertyIds().map(id => [id, obj.getProperty(id)])),
properties: convertCesium3DTileFeatureProperties(viewer, obj),
},
];
}
Expand All @@ -356,7 +375,7 @@ export const convertObjToComputedFeature = (
tag?.computedFeature ?? {
type: "computedFeature",
id: tag?.featureId ?? "",
properties: obj.properties?.getValue(viewer.clock.currentTime),
properties: convertEntityProperties(viewer, obj),
},
];
}
Expand Down
1 change: 1 addition & 0 deletions web/src/beta/lib/core/mantle/types/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,6 +72,7 @@ export type Data = {
jsonProperties?: string[];
updateInterval?: number; // milliseconds
parameters?: Record<string, any>;
idProperty?: string;
time?: {
property?: string;
interval?: number; // milliseconds
Expand Down
Loading