Cesium设置位置和视角

最新推荐文章于 2025-04-27 18:40:27 发布

何迟

最新推荐文章于 2025-04-27 18:40:27 发布

阅读量3.3w

点赞数 8

分类专栏： Cesium

本文链接：https://blog.youkuaiyun.com/qq_42036616/article/details/90140636

版权

本文介绍了如何在Cesium中设置视角，类似于谷歌地球，Cesium使用地心坐标系。通过fromDegrees方法转换经纬度和高程。要标记特定位置并保存视角，可以使用开发者工具获取camera的heading、pitch和position信息。

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

一、创建服务器（看第一篇笔记）

二、设置视角

在Cesium中是可以打开默认定标和视角的，跟谷歌地球一样，同时注意Cesium使用的坐标系是从地心坐标系，可以通过fromDegrees（）将经纬度和高程转化Cesium坐标系。

  viewer.camera.setView({
      // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
      // fromDegrees()方法，将经纬度和高程转换为世界坐标
      destination:Cesium.Cartesian3.fromDegrees(117.48,30.67,15000.0),
      orientation:{
      // 指向
      heading:Cesium.Math.toRadians(90,0),
      // 视角
      pitch:Cesium.Math.toRadians(-90),
      roll:0.0
      }
  });

同理，想要标记某个位置和角度，下次直接进入，可以在选好的角度上按F12进入开发者工具
输入viewer.camera.heading viewer.camera.pitch viewer.camera.position回车可以得到Cesium坐标系下的信息

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

何迟

关注关注

8
点赞
踩
23

收藏

觉得还不错? 一键收藏
4
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

Cesium设置地图位置与姿态

一醉千秋的专栏

07-24

329

cesium 中获取地图位置姿态信息，并进行位置信息还原

Cesium 地图视角定位到某一个范围

前端小陈的成长记录

03-13

1463

Cesium地图视角定位到某一个范围

4 条评论您还未登录，请先登录后发表或查看评论

Cesium 设置视角的两种方式

u014328243的博客

05-25

8625

作为开源WebGIS三维可视化领域的翘楚，Cesium中可以可以添加不同的Entity实体数据，也可以添加各种各样的模型数据，那么当我们添加好数据之后，如何设置视角以便于观察呢，这里介绍两种不同的方式设置视角。一种是设置添加数据的orientation属性来设置视角，另一种是设置相机的角度来设置视角。设置 orientation 属性这个方法是通过数据实体的坐标position和欧拉角（heading，pitch， roll），计算出四元数，四元数是绕空间某一点旋转的参数，即可设置orientation

Cesium学习笔记——点击位置生成积云

mingyu_mingyu的博客

04-13

837

在Cesium的学习中，学会读文档十分重要！！！在这里附上中文文档在Cesium中，有一个类CumulusCloud是专门用来制作积云的。要通过点击的位置生成积云分4步，首先创建一个CloudCollection对象，然后绑定鼠标左击事件，获取屏幕点击处的位置，接着在此位置上加入体积云，最后绑定按钮点击事件就可以了。

cesium漫游跟随视角设置初始偏移角度

HYY_YYJ的博客

03-01

961

通过实体viewFrom设置漫游时跟随视角的初始偏移量

Cesium中设置视角

警警的博客

07-29

1774

在Cesium中，设置控制场景的视角主要涉及到相机的操作，可以通过调整相机的位置、朝向以及视角范围等参数来实现对场景视角的完全控制。

cesium调整加载时的位置和视角

wenyeqv的博客

11-06

1779

Cesium加载的时候，默认还一个地球，但是当我们加载一部分地区的地形的时候，想要查看效果，还需要去调整位置，去找到相应的位置，其实，调整相机的视角，即可实现加载自动调整到相应视角首先，我们选好地区，调整好视角，按F12，打开控制台，分别输入： viewer.camera.heading viewer.camera.pitch viewer.camera.position viewer.camera.roll 来分别查看你选好的位置的坐标，视角等信息，然后利用viewer.camera，加载进代码里： .

使用cesium设置第一视角

最新发布

weixin_63115449的博客

04-27

830

在 Cesium 中，借助结合合理的视角偏移设置，可以方便地实现第一视角跟随模型移动的效果。这一功能在众多地理空间可视化、模拟仿真等应用场景中都有着重要的价值，通过进一步的优化和扩展，还能够满足更加多样化和复杂的交互需求，为用户提供简单而强大的第一视角观察体验。随着对 Cesium 功能的深入挖掘和应用场景的不断拓展，相信会解锁更多基于第一视角的创新应用方式。

Cesium常见设置视角所用到函数

警警的博客

07-03

1151

Cesium中的四元数（Quaternion）是一种用于表示三维空间中旋转的数学工具，它由四个分量组成，通常表示为(w, x, y, z)，其中w是实部，x、y、z是虚部。在Cesium中，四元数主要用于描述物体的旋转和姿态，具有精确、高效和稳定的特点。Cesium中的四元数作为一种用于描述旋转的数学工具，具有广泛的应用价值。通过合理使用四元数，可以精确地描述和控制物体的旋转、姿态和坐标变换，提升三维场景中物体运动的真实感和视觉效果。三、四元数的计算与转换。一、四元数的基本概念。

cesium设置当前视角和跳转到指定视角

lbn2676043895的博客

12-01

1680

Cesium加载3DTileset后如何调整位置

l10103的博客

10-19

1191

【代码】Cesium加载3DTileset后如何调整位置。

3、cesium如何设置默认视角

qq_58771242的博客

02-03

1774

利用Cesium.Camera.DEFAULT_VIEW_RECTANGLE这只cesium默认视角

WebGIS开发利用Cesium实现3种场景视图模式

gis_witch的博客

01-12

2129

通过场景视图模式提供三种模式：三维球面模式、三维平面模式、二维地图模式

Cesium设置三维球的视角和位置（中心点）

qq_17627195的博客

03-25

5088

设置三维球的视角和位置主要使用两个函数，一个是setView一个是flyTo。 setView：三维球立即转到对应的视角和位置上。（无延迟） flyTo：通过转动的动画，三维球转到对应的视角和位置上。（有延迟） viewer.camera.setView({ // fromDegrees()方法，将经纬度和高程转换为世界坐标 destination:Cesium.Cartesian3.fromDegrees(117.48,30.67,15000.0), orientation:{

cesium 之 flyTo、setView、lookat

pig_ning的博客

05-31

2393

cesium 之 flyTo、setView、lookat

Cesium3D模型（二）：创建3D模型，自定义模型旋转角度

--柴犬馒头--的博客

10-30

2917

// 创建模型 var modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(Cesium.Cartesian3.fromDegrees(_lon,_lat,_height)); var model = viewer.scene.primitives.add(Cesium.Model.fromGltf({ url : '/cesium/...

Cesium 在地图鼠标点击进行定位，并显示经纬度

liubangbo的专栏

05-22

2480

这篇文章介绍一下如何响应鼠标左键获取经纬度，以及在地图上添加广告牌。注意：在使用上述代码时，把accessToken 换成自己的。1）响应鼠标左键，并获取经纬度。2）在地图上添加广告牌。

Cesium orientation 和设置初始角度

zhengshaofeng1的专栏

02-03

9856

一. Cesium orientation orientation-相机镜头对准的方法. heading-代表镜头左右方向,正值为右,负值为左,360度和0度是一样的 pitch-代表镜头上下方向,正值为上,负值为下. roll-代表镜头左右倾斜.正值,向右倾斜,负值向左倾斜二. 设置初始化角度 1.先用鼠标手动调整出你想要的角度这里viewer是new出来的地图实例打印出你调整好位置的实例的参数 console.log(viewer.scene.camera.heading); con..

指定 Cesium 加载时的初始位置和视角

crazycat2046的专栏

05-02

5750

指定 Cesium 加载时的初始位置与视角功能：实现 Cesium 在加载时，自动定位到指定位置，并调整到相应视角。步骤：先选好位置，并调整好视角，然后按 F12 打开控制台分别输入： viewer.camera.position viewer.camera.heading viewer.camera.pitch viewer.camera.roll 来分别获取你选好的位置的坐标，视角等信息，然后利用 viewer.camera.setView 进行设置。 viewer.camera.setView(

cesium设置相机默认视角

03-28

<think>好的，我现在需要解决用户的问题：在Cesium中如何设置相机的默认视角，特别是Perspective模式的示例代码。首先，我得回忆一下Cesium的API，因为涉及到相机的位置和视角设置。用户提到参考的引用是关于CSS 3D变换的，可能与Cesium的3D视角设置有关，但具体到Cesium的话，可能需要查阅相关文档。Cesium中相机（Camera）的控制通常通过设置位置、方向和视角参数来实现。默认情况下，Cesium的视图可能是以地球为中心的视角，但用户想自定义初始的Perspective模式。首先，我需要确认Perspective在Cesium中的含义。在三维图形学中，Perspective通常指透视投影，与正交投影相对。Cesium默认应该就是透视投影，但用户可能想设置具体的视角参数，比如视场角（fovy）、近远裁剪面等，或者调整相机的位置和朝向。接着，我应该查找Cesium中设置相机的方法。通常，Cesium的Viewer初始化时可以设置初始相机位置。例如，使用Viewer的scene.camera属性和setView方法。或者，在创建Viewer时通过设置homeButton的view参数来定义默认视角。需要确定如何设置相机的位置、方向，以及可能的视角参数。例如，使用setView方法时，可以传入destination（位置）、orientation（方向），或者直接设置相机的position和view方向。此外，可能需要调整相机的frustum，比如PerspectiveFrustum的参数，如fovy、aspectRatio、near和far。然后，我需要编写示例代码，展示在初始化时如何设置默认的Perspective视角。可能需要包括创建Viewer实例后，立即调用相机的方法来定位视角。例如： viewer.camera.setView({ destination: Cesium.Cartesian3.fromDegrees(经度, 纬度, 高度), orientation: { heading: 方向角, pitch: 俯仰角, roll: 滚动角 } }); 或者使用flyTo或lookAt方法，但setView可能在初始化时更直接。此外，可能需要调整相机的投影模式，但Cesium默认可能已经是透视投影。不过，如果用户需要修改视场角（fovy），可能需要调整相机的frustum属性。例如： viewer.scene.camera.frustum.fov = Cesium.Math.toRadians(60); // 设置视场角为60度但需要确认这个参数是否影响默认视角的设置。最后，综合这些信息，给出一个完整的示例代码，展示如何在初始化Cesium Viewer时设置相机的默认视角为特定的Perspective模式，包括位置、方向和可能的视场角调整。同时，需要考虑用户可能需要调整的参数有哪些，比如经度、纬度、高度，heading、pitch、roll等，以及如何将这些参数正确应用到相机设置中。确保代码正确无误，并符合Cesium的最新API（因为不同版本可能有变化，但用户可能使用的是较新版本）。可能还需要引用Cesium官方文档中的相关内容来验证方法的正确性，比如Camera类的setView方法，或者Viewer的初始化参数。如果引用中存在相关示例，可能需要参考，但用户提供的引用是关于CSS的，可能不相关，所以主要依赖Cesium的官方资料。总结步骤： 1. 创建Cesium Viewer实例。 2. 使用camera.setView方法设置初始视角，包括目的地（经纬度、高度）和方向参数。 3. 可选：调整相机的frustum参数，如视场角，以改变透视效果。 4. 确保代码的正确性和可运行性。现在需要将这些步骤转化为具体的示例代码，并解释关键参数的作用，帮助用户理解如何调整这些值以达到他们想要的视角效果。</think>在Cesium中设置相机的默认视角可以通过调整`camera`的初始位置、方向和投影参数来实现。以下是示例代码及分步说明： --- ### **设置相机默认视角的示例代码** ```javascript // 创建Cesium Viewer实例 const viewer = new Cesium.Viewer('cesiumContainer', { // 可选：关闭默认的动画过渡效果 sceneModePicker: false, animation: false, timeline: false }); // 设置初始相机视角（Perspective模式） viewer.camera.setView({ destination: Cesium.Cartesian3.fromDegrees(116.39, 39.9, 1500), // 北京坐标，高度1500米 orientation: { heading: Cesium.Math.toRadians(0), // 正北方向 pitch: Cesium.Math.toRadians(-30), // 俯角30度（向下看） roll: 0 // 无滚动 } }); // 可选：调整透视投影参数（视场角） viewer.scene.camera.frustum.fov = Cesium.Math.toRadians(60); // 默认约为60度，此处显式设置 ``` --- ### **关键参数说明** 1. **`destination`** 定义相机初始位置，使用经纬度和高程坐标。例如： - `Cesium.Cartesian3.fromDegrees(经度, 纬度, 高度)`：将地理坐标转换为三维笛卡尔坐标。 2. **`orientation`** 控制相机的朝向： - `heading`：绕Z轴旋转角度（0弧度为正北，对应角度`0°`）。 - `pitch`：绕Y轴俯仰角（负值表示向下看，如`-30°`）。 - `roll`：绕X轴滚动角（通常设为0）。 3. **`frustum.fov`** 调整透视投影的视场角（Field of View），单位为弧度。较大的值会扩大视野范围（类似广角镜头效果）。 --- ### **代码验证与调试** - **检查坐标系**：确保`fromDegrees`参数顺序为`(经度, 纬度, 高度)`。 - **单位一致性**：角度参数需用`Cesium.Math.toRadians()`转换为弧度。 - **视角效果**：若需俯瞰地面，可将`pitch`设为负值（如`-30°`）；若需平视，设为`0`。 --- ### **应用场景** 此方法适用于： 1. 地图初始化时聚焦到特定区域（如城市、地标）[^1]。 2. 调整3D场景的默认观察角度（如倾斜视角增强立体感）。 3. 结合`frustum`参数控制透视变形效果。 ---