企业建设网站流程图,长春网站建设880元,如何对网站页面进行优化,免费开网站使用
params: {tx: 129.75845, //模型中心X轴坐标#xff08;经度#xff0c;单位#xff1a;十进制度#xff09;//小左ty: 46.6839, //模型中心Y轴坐标#xff08;纬度#xff0c;单位#xff1a;十进制度#xff09;//小下tz: 28, //模型中心Z轴坐标#xff08;高… 使用
params: {tx: 129.75845, //模型中心X轴坐标经度单位十进制度//小左ty: 46.6839, //模型中心Y轴坐标纬度单位十进制度//小下tz: 28, //模型中心Z轴坐标高程单位米rx: 0, //X轴经度方向旋转角度单位度ry: 0, //Y轴纬度方向旋转角度单位度rz: 1.6, //Z轴高程方向旋转角度单位度小右scale: 0.8 //缩放比例},promise.then((result) {this.update3dtilesMaxtrix(result, params) //改变位置
}
源码 update3dtilesMaxtrix(tileset, params) {//旋转var mx Cesium.Matrix3.fromRotationX(Cesium.Math.toRadians(params.rx))var my Cesium.Matrix3.fromRotationY(Cesium.Math.toRadians(params.ry))var mz Cesium.Matrix3.fromRotationZ(Cesium.Math.toRadians(params.rz))var rotationX Cesium.Matrix4.fromRotationTranslation(mx)var rotationY Cesium.Matrix4.fromRotationTranslation(my)var rotationZ Cesium.Matrix4.fromRotationTranslation(mz)//平移var position Cesium.Cartesian3.fromDegrees(params.tx, params.ty, params.tz)var m Cesium.Transforms.eastNorthUpToFixedFrame(position)//旋转、平移矩阵相乘Cesium.Matrix4.multiply(m, rotationX, m)Cesium.Matrix4.multiply(m, rotationY, m)Cesium.Matrix4.multiply(m, rotationZ, m)//比例缩放var scale Cesium.Matrix4.fromUniformScale(params.scale)Cesium.Matrix4.multiply(m, scale, m)console.log(矩阵m:, m)//赋值给tilesettileset._root.transform m},
这段代码展示了如何在 CesiumJS 中为一个 3D Tiles 模型应用旋转、平移和缩放变换并通过 tileset._root.transform 将最终的变换矩阵应用到模型的根节点_root。我将逐步解析代码的作用并解释它如何组合成一个变换矩阵来影响模型的变换。
代码解析
1. 旋转变换
var mx Cesium.Matrix3.fromRotationX(Cesium.Math.toRadians(params.rx));
var my Cesium.Matrix3.fromRotationY(Cesium.Math.toRadians(params.ry));
var mz Cesium.Matrix3.fromRotationZ(Cesium.Math.toRadians(params.rz));这里首先为 X、Y 和 Z 轴上的旋转创建了三个 3x3 旋转矩阵。params.rx、params.ry 和 params.rz 分别表示绕 X、Y 和 Z 轴旋转的角度单位是度。Cesium.Math.toRadians() 将角度转换为弧度因为 Cesium 使用弧度作为角度单位。
var rotationX Cesium.Matrix4.fromRotationTranslation(mx);
var rotationY Cesium.Matrix4.fromRotationTranslation(my);
var rotationZ Cesium.Matrix4.fromRotationTranslation(mz);Cesium.Matrix4.fromRotationTranslation() 用旋转矩阵 mx、my 和 mz 构建 4x4 变换矩阵这样可以保持原始矩阵的 3x3 部分用于旋转最后的平移部分默认为零因为我们现在只关心旋转。
2. 平移变换
var position Cesium.Cartesian3.fromDegrees(params.tx, params.ty, params.tz);
var m Cesium.Transforms.eastNorthUpToFixedFrame(position);params.tx、params.ty 和 params.tz 分别是模型在 经纬度坐标系 中的平移量经度、纬度、高度单位是度。Cesium.Cartesian3.fromDegrees() 将这些经纬度值转换为 Cartesian3 坐标系中的坐标。Cesium.Transforms.eastNorthUpToFixedFrame(position) 返回一个 从指定位置到地球坐标系的变换矩阵。这个矩阵将模型的局部坐标系East-North-Up 坐标系转换为世界坐标系FixedFrame。它用于将模型从地理坐标系中转换到地球固定坐标系中。
3. 旋转和平移矩阵的组合
Cesium.Matrix4.multiply(m, rotationX, m);
Cesium.Matrix4.multiply(m, rotationY, m);
Cesium.Matrix4.multiply(m, rotationZ, m);通过多次调用 Cesium.Matrix4.multiply()将平移矩阵 m 和旋转矩阵rotationX、rotationY 和 rotationZ依次相乘。矩阵乘法遵循从右到左的顺序即首先应用绕 Z 轴的旋转然后是绕 Y 轴的旋转最后是绕 X 轴的旋转。
4. 缩放变换
var scale Cesium.Matrix4.fromUniformScale(params.scale);
Cesium.Matrix4.multiply(m, scale, m);Cesium.Matrix4.fromUniformScale(params.scale) 创建一个均匀缩放矩阵其中 params.scale 是缩放因子。均匀缩放表示在所有轴上使用相同的比例因子。Cesium.Matrix4.multiply(m, scale, m) 将缩放矩阵应用到之前的变换矩阵 m 上完成缩放操作。
5. 最终矩阵应用到模型
tileset._root.transform m;最终的变换矩阵 m 包含了平移、旋转和缩放的综合变换。tileset._root.transform 是 3D Tiles 模型根节点的变换矩阵通过设置这个矩阵来应用变换从而影响整个模型或场景的显示。
变换矩阵组合的顺序
在这个代码中变换是按以下顺序应用的
平移首先将模型平移到指定的位置position。旋转接下来按指定角度绕 X、Y、Z 轴分别旋转模型。缩放最后应用一个均匀的缩放因子改变模型的大小。
通过这种顺序我们可以精确地控制模型的位置、方向和大小。
代码的作用总结
这段代码实际上是在计算一个 综合的变换矩阵它包括了平移、旋转和缩放并将该矩阵应用到模型的根节点上从而影响整个模型的显示。通过调整 params 对象中的参数你可以控制模型的最终位置、方向和尺寸。
params.rx、params.ry、params.rz控制旋转的角度。params.tx、params.ty、params.tz控制平移的经度、纬度和高度。params.scale控制模型的缩放因子。
最终通过这种方式模型将按照指定的变换在 Cesium 中呈现。
