Add entity to screen by drag & drop

CesiumJS
1

Hello,

I used to work on sceneMode: SceneMode.SCENE3D , and now, due to new requirements, I have to change my code to support SceneMode.SCENE2D.

My task is simple, I have a place where a img of entity is located, and when the user drag this img, by the calculation of the mouse up position, the entity will be placed.

My code is working fine for SceneMode.SCENE3D, but when I changed to 2D, something went wrong and I don’t know for sure what it is.

My onDrop function code that handle calculation of the entity position is:

// calculate new object drop area

const dim = this.refs.map.getClientRects()[0],

x = (event.clientX - dim.left),

y = (event.clientY - dim.top);

// calculate location

const mousePosition = new Cartesian2(x, y),

cartesian = this.viewer.camera.pickEllipsoid(mousePosition, this.viewer.scene.globe.ellipsoid);

if (cartesian) {

let addEntityData;

const cartographic = Cartographic.fromCartesian(cartesian),

longitudeString = CesiumMath.toDegrees(cartographic.longitude),

latitudeString = CesiumMath.toDegrees(cartographic.latitude);

and then finaly the code to initialize the new entity position is look like:

position : {

height : this.defaultHeight,

latitude : latitudeString,

longitude : longitudeString,

}

can anyone tell me what I am doing wrong?

is there another way to achieve the same calculation, like I did in 3d mode ?

Thank you.

2

Hello,

I don’t see anything wrong in the code example you provided. And it looks like picking in 2D is working correctly if you take a look at this example and switch to 2D: http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Picking.html&label=Showcases

Could you put together a code example that works in Sandcastle that reproduces the problem?

Best,

Hannah

3

Hey Hannah,
Thank you again for your fast replay. I don’t know for sure if my problem is due to my environment or due to cesium functionality.

As your advice, I entered to the Sandcastle, and saw that changing the viewer to 2D doesn’t cause such problem like I had.

For now, I don’t have much time to understand where the problem is: in my event data (that doesn’t related to 2D/3D configuration), or to the Cesium converting functions, so I decided to stick to 3D mode with some disable fields, like :

this.viewer.scene.screenSpaceCameraController.enableLook = false;

this.viewer.scene.screenSpaceCameraController.enableRotate = false;

this.viewer.scene.screenSpaceCameraController.enableTilt = false;

this.viewer.scene.screenSpaceCameraController.enableTranslate = false;

Thank you, again.

4

Actually, the error ‘Uncaught DeveloperError: 2D is not supported. An orthographic projection matrix is not invertible.’ is thrown when using ‘Pick Position’ in 2D.

5

Yes, pickPosition is currently only supported in 3D. We have an issue written up to add support to 2D here: https://github.com/AnalyticalGraphicsInc/cesium/issues/4084

-Hannah

6

I don’t have this error.

7

Hi Yossi,

Thanks again for the report. 2D and Columbus View support for scene.pickPosition were added in #4990. They will be in Cesium 1.31 on March 1.

Patrick