Cesium 系列2 - 默认位置设置及二三维切换定位问题解决

最新推荐文章于 2025-05-28 06:39:31 发布

西北码农

最新推荐文章于 2025-05-28 06:39:31 发布

阅读量1.4w

点赞数 6

CC 4.0 BY-SA版权

分类专栏： Cesium专栏文章标签： cesium

本文链接：https://blog.youkuaiyun.com/bitree1/article/details/85006727

Cesium专栏专栏收录该内容

9 篇文章

订阅专栏

本文详细介绍了在Cesium中实现地图二三维模式切换的方法，包括去除切换动画保持位置不变的技巧，以及如何自定义UI进行二三维切换。同时，提供了设置初始视点和自定义Home按钮行为的代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1，显示二三维切换按钮

SceneModePicker：true

2.设置初始视点：

var extend= Cesium.Rectangle.fromDegrees(100, 10, 120, 70);
Cesium.Camera.DEFAULT_VIEW_RECTANGLE = extend;
Cesium.Camera.DEFAULT_VIEW_FACTOR =0

3.二三维切换定位问题

点击二三维切换按钮时候，切换了会显示一个大图，并没有回到原来的位置上去，如下图：

解决方法1：

viewer.sceneModePicker.viewModel.duration = 0.0;//去掉二三维切换动画效果

设置这个参数，二三维切换的时候位置就会保持原来的了

原理： cesium底层的代码做了一个判断，如果延时参数大于0，就缩放到全球显示一个切换动画，设成0就没这个动画了

解决方法2：

切换二三维的自己做UI，调用底层的代码切换，都可以实现切换二三维

4.初始定位：

var boundingSphere = new Cesium.BoundingSphere(Cesium.Cartesian3.fromDegrees(116.4, 39.9, 100), 15000);
 
// Override behavior of home button
viewer.homeButton.viewModel.command.beforeExecute.addEventListener(function(commandInfo) {
    // Fly to custom position
    viewer.camera.flyToBoundingSphere(boundingSphere);

    // Tell the home button not to do anything
    commandInfo.cancel = true;
});

// Set custom initial position
viewer.camera.flyToBoundingSphere(boundingSphere, {duration: 0});

还有其他解决方法请留言哦，在此记录希望能够帮到你

将不定期更新资源，欢迎持续关注

想获得更多的学习知识请关注微信公众号：西北码农或扫下方二维码