WebGIS面试题(第八期)
因为这些题目都是之前面试通过记忆面试结束后记录、部分通过录音。目前我还在整理,当然有一部分也是我在做项目中出现的问题,今天就先整理一点(偷懒),因为有些答案还需要实地操作才能得出。当然依旧是答案仅供参考。
1、cesium里面polyline线段有几种表现?
在Cesium中,Polyline(线段)可以有以下几种表现类型:
-
空间直线 (Space Line / No Arc): 这种类型的线段表现为两点之间的直接连线,无视地球曲率,适用于小范围或在平面上模拟直线效果。在Cesium中,可以通过设置
Cesium.ArcType.NONE
实现。 -
球面线段 (Geodesic Line / Great Circle Arc): 考虑地球曲率,这种线段在球面上表现为大圆弧,是两点间地球上实际最短路径。使用
Cesium.ArcType.GEODESIC
可以得到这种表现形式。 -
恒向线 (Rhumb Line / Loxodrome): 恒向线是一种在航行中保持固定方位角的航线,它在地图上表现为与纬线成一定角度的曲线。在Cesium中,通过指定
Cesium.ArcType.RHUMB
可以创建恒向线。
2、Cesium中3DTiles模型如何旋转
在Cesium中,对3D Tiles模型进行旋转可以通过修改模型的modelMatrix
属性来实现。
首先加载一个3D Tiles模型,然后定义绕X轴旋转的角度,并将其转换为弧度。接着,使用Cesium.Matrix3.fromRotationX
创建了一个表示X轴旋转的3x3矩阵,然后通过Cesium.Matrix4.multiplyByMatrix3
将此旋转矩阵与模型的当前变换矩阵相乘,得到新的变换矩阵。最后,将这个包含旋转信息的新变换矩阵赋值给tileset.modelMatrix
,从而实现了模型的旋转。
具体代码如下:
// 导入Cesium库
const Cesium = require('cesium');
// 假设你已经有了一个Cesium Viewer实例
const viewer = new Cesium.Viewer('cesiumContainer');
// 加载3D Tiles数据
const tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({
url: './path/to/your/3d/tiles/tileset.json'
}));
// 定义旋转参数,例如围绕X轴旋转的角度(单位:度)
const RotateX = 45; // 旋转45度为例
// 将角度转换为弧度
const rotationInRadians = Cesium.Math.toRadians(RotateX);
// 创建一个旋转矩阵,这里以X轴旋转为例
const rotationMatrix = Cesium.Matrix3.fromRotationX(rotationInRadians);
// 将旋转矩阵转换为4x4的模型变换矩阵
// 假设tileset的初始modelMatrix为单位矩阵或者你有特定的初始变换
let modelMatrix = Cesium.Matrix4.IDENTITY;
// 应用旋转到现有的modelMatrix
Cesium.Matrix4.multiplyByMatrix3(modelMatrix, rotationMatrix, modelMatrix);
// 将更新后的modelMatrix应用到tileset上
tileset.modelMatrix = modelMatrix;
3、cesium提供了三种方式,可以对camera进行操作,这三种方式,有三个共同的参数,heading,pitch, roll,那么,这三个参数分别是什么呢?
**简单:**这三个参数组合起来可以精确控制camera的方向和视角,常用于设置camera的初始位置、动画过渡(如flyTo操作)或动态调整观察视角。在Cesium的API中,如setView
、flyTo
、或lookAt
方法中,通过orientation
对象传递这些参数,通常需要将角度从度转换为弧度使用Cesium.Math.toRadians
函数。
详细:
在Cesium中,对camera进行操作时涉及的三个共同参数——heading、pitch、roll,它们是用来描述camera方向的旋转角度,与航空和航海中常用的欧拉角类似。具体来说:
- Heading(偏航角 / Yaw): Heading代表camera绕垂直方向(通常是指向地心的方向,也就是上方向)旋转的角度,影响camera左右看向的能力。在Cesium中,正值表示向右转,负值表示向左转。
- Pitch(俯仰角 / Pitch): Pitch代表camera绕横向(水平面的正面到背面)旋转的角度,决定了camera向上或向下看的程度。正值使camera抬头向上看,负值使camera低头向下看。当pitch达到90度时,camera朝向直接向下,达到-90度时则直接向上。
- Roll(翻滚角 / Roll): Roll描述camera绕其前进方向的轴线旋转,影响camera自身的侧翻。在大多数应用场景中,camera的roll通常被设置为0,以保持camera平台的水平,但在特殊视觉效果或模拟飞行中可能会用到非零的roll值。
4、看你做过很多项目,你能描述制作cesium 热力图的逻辑步骤过程嘛,就是你如何做一个热力图。
简单回答:直接引入开源的Heatmap
详细:
-
使用heatmap.js:首先,利用
heatmap.js
生成热力图的canvas图像。你需要将地理位置数据和权重值传递给heatmap.js
,生成对应的热力图可视化。 -
转换为Cesium材质:将
heatmap.js
生成的canvas转换为Cesium的材质,然后应用于一个覆盖整个地图的Primitive或Entity上。 -
代码:
// 假设你有数据 points = [{lat: ..., lng: ..., value: ...}, ...] let heatmapInstance = h337.create({ container: document.getElementById('heatmapContainer'), // 这里需要替换为实际的容器 radius: 25, }); heatmapInstance.setData(points);
以上一些仅供参考。