Cesium 与 Babylon.js 可视化给车添加轮子

最新推荐文章于 2024-04-18 08:56:53 发布

haibalai2009

最新推荐文章于 2024-04-18 08:56:53 发布

阅读量137

点赞数

文章标签： babylonjs cesium

本文链接：https://blog.csdn.net/haibalai2009/article/details/128700293

版权

文章介绍了如何直接从Babylonjs的基础跳过，整合Cesium和Babylonjs来实现3D可视化。作者提供了一个名为@haibalai/cesium-babylonjs的类库，并展示了如何初始化该库，以及如何在场景中添加正方体形状并构建出一个汽车模型，包括使用MeshBuilder创建车体和车轮。代码示例详细说明了物体的缩放和旋转操作。

摘要由CSDN通过智能技术生成

我决定不从Babylonjs 基础来讲了直接整合cesium与babylonjs可视化来讲

我整合一个类库后续不断更新中

npm i @haibalai/cesium-babylonjs

初始化cesium-babylonjs 类库， viewer 是 Cesium 的 viewer对象

import { BabylonMapManager } from “@haibalai/cesium-babylonjs”;
BabylonMapManager.init(viewer);

添加正方体

import { BabylonMapManager } from “@haibalai/cesium-babylonjs”;
let scene = BabylonMapManager.getScene(viewer);
const outline = [
new BABYLON.Vector3(-0.3, 0, -0.1),
new BABYLON.Vector3(0.2, 0, -0.1),
]
//curved front
for (let i = 0; i < 20; i++) {
outline.push(new BABYLON.Vector3(0.2 * Math.cos(i * Math.PI / 40), 0, 0.2 * Math.sin(i * Math.PI / 40) - 0.1));
}
//top
outline.push(new BABYLON.Vector3(0, 0, 0.1));
outline.push(new BABYLON.Vector3(-0.3, 0, 0.1));
//back formed automatically
const car = BABYLON.MeshBuilder.ExtrudePolygon(“car”, {sideOrientation: 2, shape: outline, depth: 0.2}, scene);
BabylonMapManager.addToMap(car,[113.87629508972168, 22.544824222364753, 10]);
car.scaling.x = 200;
car.scaling.y = 200;
car.scaling.z = 200;
// car.rotation = new BABYLON.Vector3(-Math.PI/2,0,0);
car.addRotation(-Math.PI / 2, 0, 0);
const wheelRB = BABYLON.MeshBuilder.CreateCylinder(“wheelRB”, {diameter: 0.125, height: 0.05})
wheelRB.parent = car;
wheelRB.position.z = -0.1;
Cesium 与 Babylon.js 可视化给车添加轮子－小专栏