首页 > 其他分享 >Cesium 几何体贴模型 sampleHeight(二十二)

Cesium 几何体贴模型 sampleHeight(二十二)

时间:2023-03-01 20:12:01浏览次数:36  
标签:二十二 高程 const scene height sampleHeight Cesium

sampleHeight(position, objectsToExclude, width)

返回给定地图位置处场景几何体的高度,如果没有要从中采样高度的场景几何体,则返回未定义的高度。输入位置的高度被忽略。可以用于将对象钳夹到场景中的球体、3D平铺或基本体。
此函数仅从当前视图中渲染的球体平铺和三维平铺中采样高度。从所有其他基本体采样高度,而不管其可见性如何。

cesium中的scene.sampleHeight方法是用来查询一个位置的地形或3D模型的高度的。它需要一个Cartesian3类型的位置作为参数,返回一个数字类型的高度值。如果该位置没有地形或3D模型,返回undefined³。

示例代码如下:

// 查询一个经纬度位置的地形或3D模型高度
var position = Cesium.Cartographic.toCartesian(Cesium.Cartographic.fromDegrees(-1.31968, 0.698874));
var height = viewer.scene.sampleHeight(position);
console.log(height);

 

 

以下代码为官方示例的注释版本

// 创建一个Cesium视图器,设置一些选项
const viewer = new Cesium.Viewer("cesiumContainer", {
// 不显示信息框
infoBox: false,
// 不显示选择指示器
selectionIndicator: false,
// 开启阴影效果
shadows: true,
// 开启动画效果
shouldAnimate: true,
});
// 获取视图器的场景对象
const scene = viewer.scene;
// 设置地球表面对地形进行深度测试,以实现更真实的遮挡效果
scene.globe.depthTestAgainstTerrain = true;
// 检查浏览器是否支持sampleHeight方法,该方法用于获取给定位置的高程值
if (!scene.sampleHeightSupported) {
// 如果不支持,则弹出警告框
window.alert("This browser does not support sampleHeight.");
}
// 定义一些常量,用于控制模型和点的位置和范围
const longitude = -2.1480545852753163; // 经度(弧度)
const latitude = 0.7688240036937101; // 纬度(弧度)
const range = 0.000002; // 范围(弧度)
const duration = 4.0; // 持续时间(秒)
// 在视图器中添加一个实体,表示一个地面车辆模型,并设置其位置为给定的经纬度坐标
const entity = viewer.entities.add({
position: Cesium.Cartesian3.fromRadians(longitude, latitude),
model: {
uri: "../SampleData/models/GroundVehicle/GroundVehicle.glb",
},
});
// 在视图器中添加一个点实体,表示一个黄色的圆点,并设置其位置为一个回调函数返回的值,
// 这个回调函数会根据当前时间和范围计算出点在经纬度平面上移动的轨迹,并获取该位置处的高程值,
// 并将高程值作为点旁边标签显示出来。
const point = viewer.entities.add({
position: new Cesium.CallbackProperty(updatePosition, false),
point: {
pixelSize: 10,
color: Cesium.Color.YELLOW,
disableDepthTestDistance: Number.POSITIVE_INFINITY,

}, label: { show: false, showBackground: true,

font: “14px monospace”,

horizontalOrigin: Cesium.HorizontalOrigin.LEFT,

verticalOrigin: Cesium.VerticalOrigin.BOTTOM,

pixelOffset: new Cesium.Cartesian2(15, 15),

disableDepthTestDistance: Number.POSITIVE_INFINITY, }, });

// 定义一个数组,用于排除点实体在获取高程值时的干扰

const objectsToExclude = [point];

// 定义一个地理坐标对象,用于存储点实体的经纬度和高程

const cartographic = new Cesium.Cartographic();

// 定义一个函数,用于更新点实体的位置和标签

function updatePosition(time, result) {

// 根据当前时间和持续时间计算出一个偏移量,用于控制点在范围内左右移动

const offset = (time.secondsOfDay % duration) / duration;

// 根据偏移量更新点实体的经度坐标

cartographic.longitude = longitude - range + offset * range * 2.0;

// 点实体的纬度坐标不变

cartographic.latitude = latitude;

// 声明一个变量,用于存储高程值 
let height; // 如果浏览器支持sampleHeight方法,则调用该方法获取点实体位置处的高程值,并将其赋给height变量, // 并将objectsToExclude数组作为参数传入,以避免点实体本身对高程值的影响。 if (scene.sampleHeightSupported) { height = scene.sampleHeight(cartographic, objectsToExclude); } // 如果height变量有定义,则说明获取到了有效的高程值, if (Cesium.defined(height)) { // 则将高程值赋给地理坐标对象的height属性 cartographic.height = height; // 并将高程值转换为米为单位,并保留两位小数,作为点实体旁边标签显示出来, point.label.text = ${Math.abs(height).toFixed(2).toString()} m; // 并设置标签为可见状态 point.label.show = true; } else { // 否则,说明没有获取到有效的高程值, // 则将地理坐标对象的height属性设为0 cartographic.height = 0.0; // 并设置标签为不可见状态 point.label.show = false; } // 最后,将地理坐标对象转换为笛卡尔坐标,并返回作为点实体的位置 return Cesium.Cartographic.toCartesian( cartographic, Cesium.Ellipsoid.WGS84, result ); } // 设置视图器跟踪实体,即将视角锁定在地面车辆模型上 viewer.trackedEntity = entity;

 

 

 

 

标签:二十二,高程,const,scene,height,sampleHeight,Cesium
From: https://www.cnblogs.com/LJXXXX/p/17169522.html

相关文章

  • Cesium OSM building && Cesium widget(二十一)
     加载OSM以下是官方示例,但增加了丰富的注释//创建一个Cesium.Viewer对象,用于在网页中显示3D地球仪和地图//cesiumContainer是HTML元素的ID,用于容纳地球仪//terra......
  • Cesium 超出部分裁剪(二十一)
    以下为官网示例,但是我加上了详细的注释  //创建一个Cesium.Viewer对象,用于在网页中显示3D地球仪和地图//cesiumContainer是HTML元素的ID,用于容纳地球仪//terrai......
  • Cesium Transform(二十)
    cesium是一个用于创建3D地球和空间场景的JavaScript库,它提供了一些用于坐标变换的类,统称为transform。transform类可以帮助我们在不同的参考系之间转换点或向量,例如从地球......
  • Cesium 数据请求管理 Request_八号风球867的博客
    cesium数据请求主要通过三个类完成:Resource,RequestScheduler,Request;1.Resource:负责资源请求,发起xml请求2.RequestScheduler:负责请求调度管理3.Request:请求参数......
  • 【cesium】 FlyLine飞行漫游路线
    cesiumFlyLine飞行漫游路线mars3d.FlyLine是实体类,提供飞行漫游路线控制。使用示例在后面一、需求:拿取请求的坐标数据集展示车辆或人员轨迹1.生成轨迹数据//创建......
  • Cesium 模型移动以及视角跟随(十九)
     以下是一段示例代码,目的是使某一物体运动并进行相机跟踪该代码创建了一个CesiumViewer对象,并在其中添加了一个名为“飞机”的实体对象。该实体具有模型、位置和路径三个......
  • stm32f407探索者开发板(二十二)——通用定时器基本原理讲解
    文章目录​​一、三种定时器的区别​​​​二、通用定时器特点​​​​2.1功能特点描述​​​​2.2计数器模式​​​​三、通用定时器工作过程​​​​四、附​​一、三种......
  • Cesium 地图下钻 动态加载
    有这样一个需求:当鼠标滚轮向下滚动时,动态加载geojson数据,而向上滚动时,数据自动恢复原样。1.gif首先需要加载出全国的geojson数据,当选择某个省的时候,拾取到这个省的行政......
  • Cesium 使用canvas 自定义 label 样式
    https://blog.csdn.net/tutouxiaoyaonie/article/details/127306197项目需求:车辆按照轨迹移动,模型上方要有文本框显示车辆信息,但是cesium自带的label设置样式有限,不美观,所......
  • Cesium 聚合 开始时未聚合
    解决方法:billboard加宽高billboard:{heightReference:Cesium.HeightReference.CLAMP_TO_GROUND,image:"../../../../../static/img/POI/餐饮.png",width:50,//一定......