Hi,
I got an error when using ClippingPlanesEditor which is part of Cesium Ion SDK.
-
it is a rendering error of CesiumWidget.js when ClippingPlanesEditor object is used.
-
the error only happens after ClippingPlanesEditor is declared and even after ClippingPlanesEditor is destroyed.
-
I checked the other object that has a destroy-like method and comment on them but the issue kept happening.
-
I assume that ClippingPlanesEditor class which is one of the Cesium Ion SDK is causing this issue
Here is the code and ClippingPlanesEditor is written at activateClippingTool function.
Thank you very much.
An error occurred while rendering. Rendering has stopped.
DeveloperError: This object was destroyed, i.e., destroy() was called.
Error
at new DeveloperError (webpack-internal:///./src/sdk/cesium/Source/Core/DeveloperError.js:50:11)
at ShaderProgram.throwOnDestroyed (webpack-internal:///./src/sdk/cesium/Source/Core/destroyObject.js:44:11)
at beginDraw (webpack-internal:///./src/sdk/cesium/Source/Renderer/Context.js:1163:17)
at Context.draw (webpack-internal:///./src/sdk/cesium/Source/Renderer/Context.js:1235:3)
at DrawCommand.execute (webpack-internal:///./src/sdk/cesium/Source/Renderer/DrawCommand.js:582:11)
at executeCommand (webpack-internal:///./src/sdk/cesium/Source/Scene/Scene.js:2051:13)
at executeCommands (webpack-internal:///./src/sdk/cesium/Source/Scene/Scene.js:2336:9)
at executeCommandsInViewport (webpack-internal:///./src/sdk/cesium/Source/Scene/Scene.js:2848:3)
at Scene.updateAndExecuteCommands (webpack-internal:///./src/sdk/cesium/Source/Scene/Scene.js:2682:5)
at render (webpack-internal:///./src/sdk/cesium/Source/Scene/Scene.js:3381:9)
initHandler() {
/**
*
*/
if (this._handler !== '' && this._handler instanceof new Cesium.ScreenSpaceEventHandler) {
this._handler.destroy();
}
this._handler = new Cesium.ScreenSpaceEventHandler(this._viewer.canvas);
let result;
let $ref = this.$ref;
function changeDistance(pickedObject, distance) {
if (
Cesium.defined(pickedObject) &&
Cesium.defined(pickedObject.id) &&
Cesium.defined(pickedObject.id.plane)
) {
let selectedPlane = pickedObject.id.plane;
if (selectedPlane._clippingPlane.id === 'front') {
distance.front = selectedPlane._clippingPlane.distance;
} else if (selectedPlane._clippingPlane.id === 'back') {
distance.back = selectedPlane._clippingPlane.distance;
} else if (selectedPlane._clippingPlane.id === 'left') {
distance.left = selectedPlane._clippingPlane.distance;
} else if (selectedPlane._clippingPlane.id === 'right') {
distance.right = selectedPlane._clippingPlane.distance;
} else if (selectedPlane._clippingPlane.id === 'top') {
distance.top = selectedPlane._clippingPlane.distance;
} else if (selectedPlane._clippingPlane.id === 'bottom') {
distance.bottom = selectedPlane._clippingPlane.distance;
}
}
}
let pickedObject;
this._handler.setInputAction((movement) => {
pickedObject = this._viewer.scene.pick(movement.position);
changeDistance(pickedObject, this.params.distance);
}, Cesium.ScreenSpaceEventType.LEFT_DOWN);
this._handler.setInputAction(() => {
// pickedObject = this._viewer.scene.pick(movement.position);
if (Cesium.defined(pickedObject)) {
changeDistance(pickedObject, this.params.distance);
// this._viewer.scene.screenSpaceCameraController.enableInputs = true;
pickedObject = {};
this.saveSettings();
}
}, Cesium.ScreenSpaceEventType.LEFT_UP);
}
activateClippingTool(params) {
let angleOffset = Cesium.Math.toRadians(params.rotation ? params.rotation : 30);
let planeRotation1 = angleOffset;
let planeRotation2 = angleOffset + Cesium.Math.toRadians(90);
// const boundingSphereRadius = this._ThreeDTileset.boundingSphere.radius;
let statusRegion = params.region ? 1 : -1; // positive or negative
let rightPlane = new Cesium.ClippingPlane(
new Cesium.Cartesian3(
Math.cos(planeRotation1) * statusRegion,
Math.sin(planeRotation1) * statusRegion,
0.0
),
params.distance.right * statusRegion
);
rightPlane.id = 'right';
let leftPlane = new Cesium.ClippingPlane(
new Cesium.Cartesian3(
-Math.cos(planeRotation1) * statusRegion,
-Math.sin(planeRotation1) * statusRegion,
0.0
),
params.distance.left * statusRegion
);
leftPlane.id = 'left';
let frontPlane = new Cesium.ClippingPlane(
new Cesium.Cartesian3(
Math.cos(planeRotation2) * statusRegion,
Math.sin(planeRotation2) * statusRegion,
0.0
),
params.distance.front * statusRegion
);
frontPlane.id = 'front';
let backPlane = new Cesium.ClippingPlane(
new Cesium.Cartesian3(
-Math.cos(planeRotation2) * statusRegion,
-Math.sin(planeRotation2) * statusRegion,
0.0
),
params.distance.back * statusRegion
);
backPlane.id = 'back';
let topPlane = new Cesium.ClippingPlane(
new Cesium.Cartesian3(
0,
0,
-1 * statusRegion
),
params.distance.top * statusRegion
);
topPlane.id = 'top';
let bottomPlane = new Cesium.ClippingPlane(
new Cesium.Cartesian3(
0,
0,
1 * statusRegion
),
params.distance.bottom * statusRegion
);
bottomPlane.id = 'bottom';
let clippingPlanes = new Cesium.ClippingPlaneCollection({
planes: [
topPlane,
bottomPlane,
frontPlane,
backPlane,
leftPlane,
rightPlane
],
enabled: params.clipping,
unionClippingRegions: params.region, // when true, clips outside
edgeWidth: 0.4,
edgeColor: Cesium.Color.RED.withAlpha(0.5)
});
// Add clipping planes to 3D tileset like point cloud and model
this._ThreeDTileset.clippingPlanes = clippingPlanes;
this._ThreeDTileset.clippingPlanes.enabled = params.clipping;
let tilesets = this.primitives.filter(p => {
return p instanceof Cesium.Cesium3DTileFeature ||
p instanceof Cesium.Cesium3DTileset ||
p instanceof Cesium.Cesium3DTile ||
p instanceof Cesium.Model;
});
tilesets.forEach(t => {
t._clippingPlanes = this._ThreeDTileset.clippingPlanes;
t._clippingPlanes.enabled = params.clipping;
});
//Generates plane mouse handler and activate
this._clippingPlanesEditor = new Cesium.ClippingPlanesEditor({
scene: this._viewer.scene,
clippingPlanes: this._ThreeDTileset.clippingPlanes,
movePlanesToOrigin: false,
// pixelSize: new Cesium.Cartesian2(100, 100),
maximumSizeInMeters: new Cesium.Cartesian2(Infinity, Infinity)
});
// Change the styling of editor
// for (let i = 0; i < 6; i++) {
// this._clippingPlanesEditor._primitives._primitives[i]._outlineColor = Cesium.Color.YELLOWGREEN.withAlpha(0.8);
// }
this._clippingPlanesEditor.activate();
// Visibility of the clipping planes
let clippingPrimitives = this._getClippingPrimitives();
clippingPrimitives.show = params.visibility;
}