Cesuim 学习笔记 相机飞入

Cesuim飞入示例

这里有个强大的官网
https://sandcastle.cesium.com/?src=Camera.html
第一种 viewer.zoomTo 主要作用是回到固定模型上使用

viewer.zoomTo(Entity);

第二种 viewer.flyTo 、

viewer.camera.flyTo({
    destination: Cesium.Cartesian3.fromDegrees(-117.16, 32.71, 15000.0),
    orientation: {
      heading: Cesium.Math.toRadians(20.0),
      pitch: Cesium.Math.toRadians(-35.0),
      roll: 0.0,
    },
});

第三种 camera.setView

viewer.scene.camera.setView({
  destination: Cesium.Cartesian3.fromDegrees(-117.16, 32.71, 15000.0),
  orientation: {
    heading: Cesium.Math.toRadians(10),
    pitch: Cesium.Math.toRadians(-10),
  },
});

第四种 camera.flyTo

viewer.camera.flyTo({
            destination: Cesium.Cartesian3.fromDegrees-117.16, 32.71, 15000.0), 
      

第五种 camera.lookAt

var center = Cesium.Cartesian3.fromDegrees(-117.16, 32.71, 15000.0)//目标位置
 viewer.camera.lookAt(center, new Cesium.Cartesian3(x,x,x))

相机保持在实体上而不是在地球上居中。这是通过设置来完成的viewer.trackedEntity。跟踪实体需要position设置。

Entity.position = Cesium.Cartesian3.fromDegrees(-107.724, 42.68);
viewer.trackedEntity = Entity;

相机

一个定位

viewer.camera.flyTo({
    destination: Cesium.Cartesian3.fromDegrees(-117.16, 32.71, 15000.0),
});

更改相机的方向，请添加一个orientation选项
heading （方位角），pitch （倾角），roll（旋转角）， range（距离中心距离）

viewer.camera.flyTo({
    destination: Cesium.Cartesian3.fromDegrees(-117.16, 32.71, 15000.0),
    orientation: {
      heading: Cesium.Math.toRadians(20.0),
      pitch: Cesium.Math.toRadians(-35.0),
      roll: 0.0,
    },
});

相机方式

以几何体为对象

如果添加了图像在地图上面，可以直接用flyTo的查看器，
viewer.flyTo函数接受的Entity，EntityCollection，DataSource，Cesium3DTilset

var west = -90.0;
var south = 38.0;
var east = -87.0;
var north = 40.0;
var rectangle = viewer.entities.add({
  rectangle: {
      coordinates: Cesium.Rectangle.fromDegrees(west, south, east, north),
  },
});
viewer.flyTo(rectangle);

在primitives添加的3DTileset模型，直接用viewer.zoomTo方式

var tileset = new Cesium.Cesium3DTileset({
  url: url,
});

viewer.scene.primitives.add(tileset);
viewer.zoomTo(tileset, new Cesium.HeadingPitchRange(0.0, -0.3, 0.0));

easingFunction为缓动函数

Cesium.EasingFunction.BACK_IN //回到
Cesium.EasingFunction.BACK_IN_OUT //进入在出来
Cesium.EasingFunction.BACK_OUT //退出
Cesium.EasingFunction.BOUNCE_IN //弹出去
Cesium.EasingFunction.BOUNCE_IN_OUT //弹进去然后退出。
Cesium.EasingFunction.BOUNCE_OUT  //弹出来。
Cesium.EasingFunction.CIRCULAR_IN  //循环进
Cesium.EasingFunction.CIRCULAR_IN_OUT //循环进与出
Cesium.EasingFunction.CIRCULAR_OUT  //循环出
Cesium.EasingFunction.CUBIC_IN //曲线进
Cesium.EasingFunction.CUBIC_IN_OUT //曲线进与出
Cesium.EasingFunction.CUBIC_OUT //曲线出
Cesium.EasingFunction.ELASTIC_IN //弹性的进
Cesium.EasingFunction.ELASTIC_IN_OUT //弹性的进与出
Cesium.EasingFunction.ELASTIC_OUT//弹性的出
Cesium.EasingFunction.EXPONENTIAL_IN //曲线进
Cesium.EasingFunction.EXPONENTIAL_IN_OUT//曲线进与出
Cesium.EasingFunction.EXPONENTIAL_OUT //曲线出
Cesium.EasingFunction.LINEAR_NONE //线性缓动
Cesium.EasingFunction.QUADRATIC_IN//二次进
Cesium.EasingFunction.QUADRATIC_IN_OUT//二次进与出
Cesium.EasingFunction.QUADRATIC_OUT//二次出
Cesium.EasingFunction.QUARTIC_IN//四次进
Cesium.EasingFunction.QUARTIC_IN_OUT//四次进与出
Cesium.EasingFunction.QUARTIC_OUT //四次出
Cesium.EasingFunction.QUINTIC_IN//五次进
Cesium.EasingFunction.QUINTIC_IN_OUT//五次进与出
Cesium.EasingFunction.QUINTIC_OUT//五次出
Cesium.EasingFunction.SINUSOIDAL_IN//正弦曲线的进
Cesium.EasingFunction.SINUSOIDAL_IN_OUT//正弦曲线进与出
Cesium.EasingFunction.SINUSOIDAL_OUT//正弦曲线出

Cesium.EasingFunction.Callback （时间） →数字
用于实现自定义缓动功能的函数接口。

function quadraticIn(time) {
    return time * time;
}//进
function quadraticOut(time) {
    return time * (2.0 - time);
}//出

一个点对象进入

要将相机锁定到一个点，使用相机的lookAtTransform功能

ar center = Cesium.Cartesian3.fromRadians(2.4213211833389243, 0.6171926869414084, 3626.0426275055174);
var transform = Cesium.Transforms.eastNorthUpToFixedFrame(center);
viewer.scene.camera.lookAtTransform(transform, new Cesium.HeadingPitchRange(0, -Math.PI/4, 2900));

viewer.clock.onTick.addEventListener，创建一个相机轨道

viewer.clock.onTick.addEventListener(function(clock) {
  viewer.scene.camera.rotateRight(0.005);
});

使用ScreenSpaceCameraController来控制是否允许摄像机进入地下

viewer.scene.screenSpaceCameraController.enableCollisionDetection = false;