Hi all,
I’m trying to use the Cesium Ion Measurement Tool in my CRA + CRACO-based React project. Here’s a breakdown of my setup:
Package Versions
{
"@cesiumgs/ion-sdk-measurements": "file:packages/cesiumgs-ion-sdk-measurements-7.0.0/package",
"cesium": "1.108",
"craco-cesium": "^1.2.0"
}
Peer Dependencies (in local ion-sdk-measurements)
"peerDependencies": {
"@cesium/engine": "*",
"@cesium/widgets": "*"
}
I followed the advice in this thread:
Cesium Ion SDK initialization crashes renderer in production
How I Installed the Measurement SDK
I installed the @cesiumgs/ion-sdk-measurements
locally using:
npm install --save ./packages/cesiumgs-ion-sdk-measurements-7.0.0/package
Implementation
Here’s my hook for activating the measurement tool:
import {
AreaUnits,
DistanceUnits,
MeasureUnits,
viewerMeasureMixin,
VolumeUnits
} from '@cesiumgs/ion-sdk-measurements';
import { useEffect } from 'react';
export const useMeasurementTool = ({ viewerRef }) => {
useEffect(() => {
if (!viewerRef.current) return;
viewerRef.current.extend(viewerMeasureMixin, {
units: new MeasureUnits({
distanceUnits: DistanceUnits.METERS,
areaUnits: AreaUnits.SQUARE_METERS,
volumeUnits: VolumeUnits.CUBIC_METERS,
}),
});
}, [viewerRef]);
};
Error on Render
As soon as the measurement tool is initialized, Cesium throws the following error:
An error occurred while rendering. Rendering has stopped.
DeveloperError: renderState.lineWidth is out of range. Check minimumAliasedLineWidth and maximumAliasedLineWidth.
Error
at new DeveloperError (http://localhost:2023/static/js/bundle.js:18738:11)
at new RenderState (http://localhost:2023/static/js/bundle.js:65207:11)
at __webpack_modules__../node_modules/@cesium/engine/Source/Renderer/RenderState.js.RenderState.fromCache (http://localhost:2023/static/js/bundle.js:65430:16)
at __webpack_modules__../node_modules/@cesium/engine/Source/Scene/PointPrimitiveCollection.js.PointPrimitiveCollection.update (http://localhost:2023/static/js/bundle.js:144498:90)
at __webpack_modules__../node_modules/@cesium/engine/Source/Scene/PrimitiveCollection.js.PrimitiveCollection.update (http://localhost:2023/static/js/bundle.js:149282:19)
at PrimitiveCollection.update (http://localhost:2023/cesium/Cesium.js:139352:21)
at updateAndRenderPrimitives (http://localhost:2023/cesium/Cesium.js:227240:23)
at executeCommandsInViewport (http://localhost:2023/cesium/Cesium.js:227092:5)
at Scene4.updateAndExecuteCommands (http://localhost:2023/cesium/Cesium.js:226910:7)
at render (http://localhost:2023/cesium/Cesium.js:227548:11)}
...
My Question
Has anyone successfully used the @cesiumgs/ion-sdk-measurements
package with:
"cesium": "1.108"
"craco-cesium": "^1.2.0"
- CRA (React + CRACO)
I’m not sure if this is a bug in ion-sdk-measurements
, or if there’s a compatibility issue between Cesium versions or with how line widths are handled in WebGL (especially on certain GPUs or platforms).
Any guidance or working examples would be greatly appreciated.
Thanks in advance!