Cesium - why is scene.pickPositionSupported false

匿名 (未验证) 提交于 2019-12-03 02:33:02

问题:

I'm ultimately trying to draw a polygon on top of my house. I can do that.

The problem is that on zoom-out, zoom-in, and rotation (or camera move) the polygon doesn't stick to the top of my house. I received great help from this answer. So, now I'm trying to go through the sample code but there is a lot of Cesium methods and functionality that I need to learn.

The sample code I am trying to follow is located in the gold standard that appears to be baked into the existing camera controller here.

I call testMe with the mousePosition as Cartesian3 and the SceneMode is 3D, so pickGlobe is executed.

Here is my code:

var pickedPosition; var scratchZoomPickRay = new Cesium.Ray(); var scratchPickCartesian = new Cesium.Cartesian3(); function testMe(mousePosition) {     if (Cesium.defined(scene.globe)) {          if(scene.mode !== Cesium.SceneMode.SCENE2D) {             pickedPosition = pickGlobe(viewer, mousePosition, scratchPickCartesian);         } else {             pickedPosition = camera.getPickRay(mousePosition, scratchZoomPickRay).origin;         }     } }  var pickGlobeScratchRay = new Cesium.Ray(); var scratchDepthIntersection = new Cesium.Cartesian3(); var scratchRayIntersection = new Cesium.Cartesian3();     function pickGlobe(viewer, mousePosition, result) {      var globe = scene.globe;     var camera = scene.camera;      if (!Cesium.defined(globe)) {         return undefined;     }      var depthIntersection;     if (scene.pickPositionSupported) {         depthIntersection = scene.pickPosition(mousePosition, scratchDepthIntersection);     }      var ray = camera.getPickRay(mousePosition, pickGlobeScratchRay);     var rayIntersection = globe.pick(ray, scene, scratchRayIntersection);      var pickDistance;     if(Cesium.defined(depthIntersection)) {         pickDistance = Cesium.Cartesian3.distance(depthIntersection, camera.positionWC);     } else {         pickDistance = Number.POSITIVE_INFINITY;     }      var rayDistance;     if(Cesium.defined(rayIntersection)) {         rayDistance = Cesium.Cartesian3.distance(rayIntersection, camera.positionWC);     } else {         rayDistance = Number.POSITIVE_INFINITY;     }      var scratchCenterPosition = new Cesium.Cartesian3();     if (pickDistance < rayDistance) {         var cart = Cesium.Cartesian3.clone(depthIntersection, result);         return cart;     }      var cart = Cesium.Cartesian3.clone(rayIntersection, result);     return cart; } 

Here is my problem:

Here is the result:

Here are my questions to get this code working:

1. How do I get the scene.pickPositionSupported set to true? I'm using Chrome on Windows 10. I cannot find in the sample code anything about this and I haven't had much luck with the documentation or Google.

2. Why is rayIntersection not getting set? ray and scene have values and scratchRayIntersection in an empty Cartesian3.

I think if I can get those two statements working, I can probably get the rest of the pickGlobe method working.

WebGLGraphics Report:

I clicked on Get WebGL and the cube is spinning!

回答1:

Picking positions requires that the underlying WebGL implementation support depth textures, either through the WEBGL_depth_texture or WEBKIT_WEBGL_depth_texture extensions. scene.pickPositionSupported is returning false because this extension is missing. You can verify this by going to http://webglreport.com/ and looking at the list of extensions; I have both of the above listed there. There is nothing you can do in your code itself to make it suddenly return true, it's a reflection of the underlying browser.

That being said, I know for a fact that Chrome supports the depth texture and it works on Windows 10, so this sounds like a likely video card driver issue. I full expect downloading and installing the latest drivers for your system to solve the problem.

As for rayIntersection, from a quick look at your code I only expect it to be defined if the mouse is actually over the globe, which may not always be the case. If you can reduce this to a runnable Sandcastle example, it would be easier for me to debug.



回答2:

OK. So it turned out that I had a totally messed up Cesium environment. I had to delete it and reinstall it in my project (npm install cesium --save-dev). Then I had to fix a few paths and VOILA! It worked. Thanks to both of you for all your help.



标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!