Cesium map due to transfrom caused map offset, click inaccurate problem

[eliayng]

Cesium map due to transfrom caused map offset, click inaccurate problem.

Now change the vue file path:/cesium/Source/Core/ScreenSpaceEventHandler.js

Change the getPosition method inside as follows：

function getPosition(screenSpaceEventHandler, event, result) { var element = screenSpaceEventHandler._element; var fa = element.offsetWidth/element.getBoundingClientRect().width; var fa1 = element.offsetHeight/element.getBoundingClientRect().height; if (element === document) { result.x = event.clientX * fa; result.y = event.clientY * fa1; return result; }

var rect = element.getBoundingClientRect(); result.x = (event.clientX - rect.left) * fa; result.y = (event.clientY - rect.top) * fa1; return result; }

The above is my way of handling. May I ask whether it can be added into the official document?

[ggetz]

Hi @eliayng. Could you please explain this in more detail?

Cesium map due to transform caused map offset, click inaccurate problem.

Could you include a Sandcastle example which duplicates it?

[ggetz]

I'm closing this due to inactivity. @eliayng If you have more info, please feel free to re-open this issue. Thanks!

[hxbb00]

https://sandcastle.cesium.com/#c=bY9NS8QwEIb/ypBTBU13QUFqugh7FTwInnLJprPbsGlSkmnrKv5326ZbPGwgQ+bJ+86H9i4S9AYHDFCCwwH2GE3X8M+ZZZLpOd97R8o4DJLdvUjH7pmIdLG4kw7m82qa1geCLtiM85ywaa0ijPmh02ckrmOcjADT5VX/0Kj2J5kpKBePPjRF1MpituVPSQowmIrq4nmzab8WUqM51VQ8/kNT/E1PkV+nEpXpQVsVYylZaifZlZuqvLHYKj921n6YbxwNIh/1S1xarAWsV5Vxp/ceg1WXSVxvd28Jcs5FPqa3neS9Paiw1k//fw

[hxbb00]

[HowieChy]

@ggetz Please take a look at this example. When the parent DOM element applies a scale transformation, it becomes unselectable upon clicking.

https://sandcastle.cesium.com/#c=bVLNbtswDH4Vwpc6QCrbcQ6r6xTbvAEbVmCHFevFF8WmE2GyZEhyfjbkLXYesKcYeurT5D0mW47TYdGBJj9+JD8SLqTQBjYMt6hgAQK3kKFmbU2+9pife0UfZ1IYygSq3Jvc5oKjAU6XyBeulqAwzDDUhJal/yMX0D9Ba0zgqsRaXk1PYIm6UKwxTAqbm8XdO2cbqZlLDUIyqoz1qIhJpWT9DlcKUftRFJM4uommMItJFN7YbxhOxja9uARGJQAGd8bOOz49H//8Ov7+eR4JUNntOi3zZgeaCn2tUbHqHwbjPJNcqrOuLiKPHz4+vH/Bk63h9kyXqG/v32Sf/qc+stKsE5iPmcPgOXvozm3d4c4V3z9Iv99ucutNvVSbPce7U+1rVjdSGWgV9wkJDNYNp/Z8wbItvqEhhdZdP9eclJvrmjbDjYyyi1dS1YkuKEc/IjNHBdj2El+FYbMbkDWy1dok8xdQZw/OTYOTqrRkGyg41XqRe25c7p1wVi4u/F4jvWo5/8K+oy1IA8sf7DBibMAlLZlYfd6g4nTfkdfR3b0DCSFpYMPLlUZKvqRq7O/yfwE

[hgy9473]

more infomation about the bug

steps to reproduce

1. used CSS transform scale() function on Viewer's DOM element or parent DOM element, and the scale paraments is not 1.

example :

#cesiumContainer{
  transform: scale(1.5, 1,5)
}

2. use CSS zoom function on Viewer's DOM element or parent DOM element, and the scale paraments is not 1.

example:

#cesiumContainer{
  transform: 1.5;
}

some of the problems caused by this bug

1. mouse click event can not pick graphics or model.

2. mouse wheel event zoom in/out map not keep mouse position.

3. mouse drag event panning the map doesn't feel right at the panning distance.