当前位置: 首页 > news >正文

cesium拾取pick系列(拾取坐标和对象)

参考了网上的一系列知识以及自己亲自测试的代码,记录总结如下 

目录

1 window.viewer.scene拾取

1.1 window.viewer.scene.pick 

1.2 window.viewer.scene.pickPosition 

1.3 window.viewer.scene.drillPick 

2 window.viewer.scene.camera拾取

3 window.viewer.scene.globe拾取

4 window.viewer.imageryLayers.pickImageryLayerFeatures 拾取


1 window.viewer.scene拾取

1.1 window.viewer.scene.pick 

window.viewer.scene.pick (windowPosition,width , height ) →0bject 

拾取cesium场景中的空间对象,且返回最前面的一个空间对象,可以拾取entity实体,primitive图元,数据源datasource,3dtiles瓦片数据。

let handler = new Cesium.ScreenSpaceEventHandler(window.viewer.canvas);
      handler.setInputAction(function (event) {
        let pickedObject = window.viewer.scene.pick(event.position);
        if (!Cesium.defined(pickedObject)) {
          console.log("没有拾取到空间对象")
          return;
        }
        console.log(pickedObject)
      }, Cesium.ScreenSpaceEventType.LEFT_CLICK)

1.2 window.viewer.scene.pickPosition 

window.viewer.scene.pickPosition (windowPosition,result)→Cartesian3

拾取cesium场景中的笛卡尔坐标,并返回笛卡尔坐标值。

注意:获取到笛卡尔坐标存在不准确性:

1.在没有地质的情况下,不开启深度测试,在地球上拾取是准确的;

2.在有地质的情况下,不开启深度测试,在地球上拾取是不准确的;因为存在深度问题,必须开启深度测试。

let handler = new Cesium.ScreenSpaceEventHandler(window.viewer.canvas);
      handler.setInputAction(function (event) {
        let earthPosition = window.viewer.scene.pickPosition(event.position);
        if (Cesium.defined(earthPosition)) {
          let cartographic = Cesium.Cartographic.fromCartesian(earthPosition);
          let lon = Cesium.Math.toDegrees(cartographic.longitude).toFixed(5);
          let lat = Cesium.Math.toDegrees(cartographic.latitude).toFixed(5);
          let height = cartographic.height.toFixed(2);
          console.log(earthPosition, {
            lon: lon,
            lat: lat,
            height: height,
          });
        }
      }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

深度测试开启

window.viewer.scene.globe.depthTestAgainstTerrain = true;

1.3 window.viewer.scene.drillPick 

window.viewer.scene.drillPick (windowPosition,limit ,width,height ) →Array.<*> 

拾取场景中的对象,并返回对象数组且limit限定的最多数量,可以拾取entity实体,primitive图元,数据源datasource,3dtiles瓦片数据

let handler = new Cesium.ScreenSpaceEventHandler(window.viewer.canvas);
      handler.setInputAction(function (event) {
        //event包含坐标信息,3是返回的数量,大于三则为最前面3个,否则实际获取的数量
        let pickedObject = viewer.scene.drillPick(event.position, 3);
        console.log(pickedObject)
      }, Cesium.ScreenSpaceEventType.LEFT_CLICK)

2 window.viewer.scene.camera拾取

window.viewer.scene.camera.pickEllipsoid (windowPosition,ellipsoid , result ) →Cartesian3

获取相机视角下鼠标点的对应椭球面位置 

注意:此方法是用于获取椭球面的笛卡尔坐标信息,且不用考虑地质的深度。
如果用该方法获取的坐标拾取点是存在不准确性的,因为该方法只获取与球面相交的坐标点,不包含地形、模型、倾斜摄影表面带有高度的对象值。在有地质数据时,所以无论是否开启深度测试,获取的三维坐标数据都是不准确。反正记住,使用此方法,关掉深度测试。

3 window.viewer.scene.globe拾取

let ray = viewer.camera.getPickRay(event.position);

window.viewer.scene.globe.pick (ray,scene,result ) Cartesian3

专门用于获取地形加载后,拾取地形上的经纬度(弧度)以及高程 

let handler = new Cesium.ScreenSpaceEventHandler(window.viewer.canvas);
      handler.setInputAction(function (event) {
        //相机到鼠标点的射线
        let ray = viewer.camera.getPickRay(event.position);
        //相机到鼠标点的射线与地形场景相交
        let position = viewer.scene.globe.pick(ray, viewer.scene);
        console.log(position);
        //笛卡尔坐标转经纬度(弧度)
        let cartesian = Cesium.Cartographic.fromCartesian(position);
        console.log(cartesian)
      }, Cesium.ScreenSpaceEventType.LEFT_CLICK)

注意:此方法无论是否存在地质,无论是否开启地质的深度测试,获取与地形的笛卡尔坐标都是准确的,因为此方法只是与地形的求交,不包括模型、倾斜摄影表面。

4 window.viewer.imageryLayers.pickImageryLayerFeatures 拾取

window.viewer.imageryLayers.pickImageryLayerFeatures (ray,scene)→Promise.<Array.<ImageryLayerFeatureInfo >>

用于获取影像图层信息 

let handler = new Cesium.ScreenSpaceEventHandler(window.viewer.canvas);
      handler.setInputAction((event) => {
        let pickRay = window.viewer.camera.getPickRay(event.position);
        let ImageryLayerFeatures = window.viewer.imageryLayers.pickImageryLayerFeatures(pickRay, window.viewer.scene);
        if (!Cesium.defined(ImageryLayerFeatures)) {
          console.log('没有影像图层要素信息选中');
        } else {
          Cesium.when(ImageryLayerFeatures, function (LayerFeatures) {
            //获取到图层数据
            if (LayerFeatures.length > 0) {
              console.log(LayerFeatures)
            }
          });
        }
      }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

相关文章:

  • 说一说js继承的方法和优缺点?
  • ARMv8/ARMv9的Exclusive机制深度解读
  • 机器学习——梯度下降算法
  • 64.【网络编程】
  • Python爬虫-网页认识
  • 面试官:深度不够,建议回去深挖
  • [ vulhub漏洞复现篇 ] Apache APISIX 默认密钥漏洞 CVE-2020-13945
  • 接口测试用例生成工具介绍及应用
  • C#接入 NPOI
  • 面试百问:项目上线后才发现bug怎么办?
  • SpringBoot+Vue实现前后端分离网上药店平台
  • Simulink 自动代码生成电机控制:基于Keil软件集成
  • LQ0103 子串分值【字符串】
  • 数据库实战经验分享(全量表,增量表,拉链表,流水表,快照表)
  • 【node.js从入门到精通】使用express创建web服务器,路由,进行中间件的创建链接路由及其他中间件
  • [NodeJS] 关于Buffer
  • Asm.js的简单介绍
  • Java 网络编程(2):UDP 的使用
  • java8 Stream Pipelines 浅析
  • linux安装openssl、swoole等扩展的具体步骤
  • magento 货币换算
  • PaddlePaddle-GitHub的正确打开姿势
  • 道格拉斯-普克 抽稀算法 附javascript实现
  • 聊聊flink的BlobWriter
  • 正则表达式
  • # 计算机视觉入门
  • #include到底该写在哪
  • #Linux(权限管理)
  • #stm32整理(一)flash读写
  • #我与Java虚拟机的故事#连载13:有这本书就够了
  • $ is not function   和JQUERY 命名 冲突的解说 Jquer问题 (
  • (2/2) 为了理解 UWP 的启动流程,我从零开始创建了一个 UWP 程序
  • (独孤九剑)--文件系统
  • (附源码)springboot工单管理系统 毕业设计 964158
  • (含react-draggable库以及相关BUG如何解决)固定在左上方某盒子内(如按钮)添加可拖动功能,使用react hook语法实现
  • (强烈推荐)移动端音视频从零到上手(上)
  • (三)mysql_MYSQL(三)
  • (一)spring cloud微服务分布式云架构 - Spring Cloud简介
  • .net core 6 集成和使用 mongodb
  • .net core IResultFilter 的 OnResultExecuted和OnResultExecuting的区别
  • .NET 药厂业务系统 CPU爆高分析
  • .NET/C# 的字符串暂存池
  • .NET中 MVC 工厂模式浅析
  • /dev下添加设备节点的方法步骤(通过device_create)
  • ;号自动换行
  • @NestedConfigurationProperty 注解用法
  • [20160902]rm -rf的惨案.txt
  • [Angularjs]asp.net mvc+angularjs+web api单页应用
  • [CSS]浮动
  • [EMWIN]FRAMEWIN 与 WINDOW 的使用注意
  • [GXYCTF2019]禁止套娃
  • [HITCON 2017]SSRFme perl语言的 GET open file 造成rce
  • [HTML]Web前端开发技术6(HTML5、CSS3、JavaScript )DIV与SPAN,盒模型,Overflow——喵喵画网页
  • [IE编程] 如何编程清除IE缓存
  • [kubernetes]控制平面ETCD