Cesium开发工具篇 | 03相机控制

相机控制主要是用于相机的飞行定位,例如系统初始化位置定位、视点切换、设备定位、报警事件定位等,这些都是通过对相机进行操作实现的。Cesium虽然提供了很多种方法用于实现相机的飞行定位,但这些方法都是基于Viewer、Camera这两个类实现的。

Viewer类

在Viewer类里面有两个方法用于实现相机的飞行定位,分别是flyTo、zoomTo方法。这两个方法第一个参数都是 target ,类型可以是Entity、DataSource、ImageryLayer、Cesium3DTileset等;flyTo方法的第二个参数是 options ,它是一个包含duration(飞行持续时间)、maximumHeight(飞行中的最大高度)、offset(HeadingPitchRange类型)的对象,而 zoomTo 方法的第二个参数是 offset ,即上面 options 中的 offset ,也是一个HeadingPitchRange类型的对象。Viewer类中的相机定位方法如下图所示:

Camera类

Camera 类对应的相机定位方法比较多,包括如下图所示的五个方法,每个方法的参数及参数类型都用不同的颜色区分开来。其中,options对象参数只列出了主要的属性,想查看全部参数请查阅官方 API 文档。

不管是Viewer类还是Camera类中的方法都能实现相机的定位功能,根据实际情况选择其一或组合使用。其中viewer.flyTo()、camera.flyTo()、camera.flyToBoundingSphere()这三个方法会有一个飞行动画的效果,所以会有飞行持续时间参数duration,默认是3秒。

相机参数

我们不管使用哪种方式,基本上都是先确定相机要飞到的某一个位置,如点、矩形、包围球等,然后再结合相机的三个参数heading、pitch、roll或range实现某一位置视角的计算。下面主要介绍这三个参数。

我们知道Cesium使用的是笛卡尔空间直角坐标系,X、Y、Z三个轴的正方向如下图所示:

相机的三个参数heading、pitch、roll的值是针对于坐标轴旋转的弧度数,示意图如下所示:

  • heading:偏航角(弧度)
    绕负Z轴旋转,顺时针为正,默认为正北方向0,其中正角向东增加。控制机体头的朝向位置,即左右方向的改变。
  • pitch:俯仰角(弧度)
    绕负Y轴旋转,顺时针为正,默认为俯视-90。正俯仰角在飞机上方,负俯仰角在飞机下方。可简单理解成前空翻、后空翻。
  • roll:翻滚角(弧度)
    绕正x轴旋转,顺时针为正,默认为0。可简单理解成侧空翻。
  • range:范围(米)
    代表相机距离目标的距离。

示例应用

问题:已知某一矩形范围 [110.2,35.6,112.3,36.7] ,要求相机倾斜25度,实现矩形位置飞行定位。
下面采用两种方法实现,并附上核心代码。

方法一:viewer.flyTo

 var entity = viewer.entities.add({
      rectangle: {
        coordinates: rect,
        material: Cesium.Color.GREEN.withAlpha(1.0),
        height: 10.0,
        outline: false,
      },
    });

    var heading = Cesium.Math.toRadians(0.0);
    var pitch = Cesium.Math.toRadians(-25.0);
    var roll = Cesium.Math.toRadians(0);
    var range = 0;
    viewer.flyTo(entity, {
      offset: new Cesium.HeadingPitchRange(heading, pitch, range),
    });

方法二:camera.flyTo

    var rect = Cesium.Rectangle.fromDegrees(110.2, 35.6, 112.3, 36.7);
    viewer.camera.flyTo({
      destination: rect,
      orientation: new Cesium.HeadingPitchRoll(heading, pitch, roll),
    });

咦???很奇怪,方法二竟然定位错误!!!但鼠标稍微往上拖拽一下,就能看到绿色的矩形。是什么原因造成的呢?问题出现在pitch值不是相机的默认值。

当相机的pitch不是默认值的时候,就会出现相机定位的位置不在屏幕中心的问题,但这时候使用viewer.flyTo方法来实现定位就能解决此问题。所以,建议采用方法一实现相机的飞行定位。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,657评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,662评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,143评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,732评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,837评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,036评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,126评论 3 410
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,868评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,315评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,641评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,773评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,470评论 4 333
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,126评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,859评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,095评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,584评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,676评论 2 351

推荐阅读更多精彩内容