WebGIS面试题（第八期）

2024-07-20 07:12:49

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);

以上一些仅供参考。

码农公寓