cesium移动指定坐标到中心并放大

Question

头一次上手cesium，需求背景是已知经纬度，需要把经纬度定位到视图中心，并且放大，求各位熟悉webgis的同学指点

Answer 1

引自免费微信小程序：皆我百晓生

要在Cesium中实现将给定的经纬度移动到视图中心并放大，你需要首先创建一个Cartesian3对象来表示这个位置，然后设置Camera的destination属性为这个点。接着调整Camera的fov（视场角）来放大视图。下面是一个详细的步骤和示例代码。

1. 首先确保你已经引入了Cesium库。如果你还没有，在HTML文件头部添加以下引用：

<script src="https://cesium.com/downloads/cesiumjs/releases/1.85/Build/Cesium/Cesium.js"></script>
<link rel="stylesheet" href="https://cesium.com/downloads/cesiumjs/releases/1.85/Build/Cesium/Widgets/widgets.css">

1. 在HTML中创建一个用于显示Cesium场景的div元素：

<div id="cesiumContainer" style="width: 100%; height: 600px;"></div>

1. 接下来编写JavaScript代码来初始化Cesium场景，并将给定的经纬度移动到视图中心并放大：

// 创建Cesium Viewer实例
var viewer = new Cesium.Viewer('cesiumContainer', {
    // 其他选项可以在这里配置，例如：shouldAnimate: true
});

// 定义要定位的经纬度
var latitude = 40.7128; // 纽约市纬度
var longitude = -74.0060; // 纽约市经度
var altitude = 0; // 海拔，默认地面高度

// 将经纬度转换为Cesium Cartesian3对象
var position = Cesium.Cartographic.fromDegrees(longitude, latitude, altitude);
var cartPosition = Cesium.Cartographic.toCartesian(position);

// 设置相机目的地为经纬度位置
viewer.camera.flyTo({
    destination: cartPosition,
    orientation: {
        heading: Cesium.Math.toRadians(0), // 朝向北
        pitch: Cesium.Math.toRadians(-90), // 从上方看
        roll: 0
    },
    duration: 0 // 立即到达，无动画效果
});

// 放大视图，调整视角
var camera = viewer.camera;
camera.frustum.fovy = Math.PI / 2; // 视场角，值越大视野越广

这段代码会立即定位到纽约市并放大视图。你可以根据实际需求调整经纬度、海拔、初始视角以及缩放程度。注意，这里的Math.toRadians函数用于将角度转换为弧度，因为Cesium中的很多数学计算都使用弧度。