xeokit / xeokit-sdk

Open source JavaScript SDK for viewing high-detail, full-precision 3D BIM and AEC models in the Web browser.
https://xeokit.io
Other
738 stars 291 forks source link

Picking doesn't work on big models on chrome #546

Closed Amoki closed 3 years ago

Amoki commented 3 years ago

Describe the bug On Chrome (it works on Firefox), picking doesn't work on big models. If a load just Lyon2, it works. If I load the full city, I can't pick anymore and zoom is really slow (picked nothing, so zoom speed is set to the default I guess)

To Reproduce Steps to reproduce the behavior:

  1. Load all models of Lyon
  2. Zoom or pick a building, it doesn't work

Expected behavior Be able to pick or zoom

Desktop (please complete the following information):

It works on firefox.

Additional context config:

const viewer = new Viewer({
  canvasId: this.engine3dCanvasId,
  enableOffsets: false,
  logDepthBufferEnabled: true,
});

viewer.cameraControl.doublePickFlyTo = false;
viewer.cameraControl.panRightClick = false;

viewer.cameraControl.followPointer = true;
viewer.cameraControl.smartPivot = true;

viewer.camera.perspective.near = 0.1;
viewer.camera.perspective.far = 1e27; // I tried with a 1 000 000, same result
viewer.camera.ortho.near = 0.1;
viewer.camera.ortho.far = 1e27;

new ViewCullPlugin(viewer, {
  maxTreeDepth: 20,
});
xeolabs commented 3 years ago

Reason for this is that the massive far clipping plane distance of 1e27 screws up picking.

Everything works fine with a distance of 100000 or 1000000, which is still 100km or 1000km.

So not really a bug, just exceeding accuracy limitations.

xeolabs commented 3 years ago

I've updated the examples in an upcoming PR.

Amoki commented 3 years ago

I have the same problem with far = 1000000 and far = 100000;

Picking works with 1e27 on smaller models.

xeolabs commented 3 years ago

How about making the near plane 1.0? As a general rule, that improves the projection accuracy that picking relies on - see if that helps.

Amoki commented 3 years ago

It doesn't work with near = 1.0. As it works on Firefox, I'm not sure it's a configuration problem.

xeolabs commented 3 years ago

Does this work?

https://xeokit.github.io/xeokit-sdk/examples/#CameraControl_orbit_Lyon

Works for me on Ubuntu/Chrome, Android and IOS 14.2

Amoki commented 3 years ago

Hmmm, It works on your example... I'll investigate.

(Enabling SmartPivot on the example doesn't work)

xeolabs commented 3 years ago

SmartPivot seems to work for me in that example:

Peek 2021-01-28 12-14

Amoki commented 3 years ago

My bad. We use the pivot sphere since smart pivot is out and in my mind, smart pivot == pivot sphere, which is wrong.

But this is nice :D Capture d’écran de 2021-01-28 12-17-09

Amoki commented 3 years ago

Ok, I got it.

I missed https://github.com/xeokit/xeokit-sdk/commit/a0205c3061cc87dae5a94918ed163a8b01739496 and was still using Viewer.logarithmicDepthBufferSupported.

If I set viewer.camera.perspective.far = 10000000; and logarithmicDepthBuffer is not supported (iOS Safari), what happens?

xeolabs commented 3 years ago

Results will vary, depending on the geometry.

If you use a linear depth buffer, then when viewing tightly-packed geometry from a distance may result in Z-fighting. Log depth buffer may give the precision required for the Z-test to properly layer the geometries.

For the Lyon model, the geometries are distinct enough that log depth buff doesn't make much difference.

A couple of examples to try:

https://xeokit.github.io/xeokit-sdk/examples/#logDepthBuf_PerformanceModel_batching_RTC https://xeokit.github.io/xeokit-sdk/examples/#logDepthBuf_PerformanceModel_batching_RTC_logDepthBufDisabled