Cesium设置飞到矩形范围中心点(获取矩形范围中心点)

前言:

最近一个需求给了一个矩形范围让获取矩形范围中心点,找了api,记录一下实现过程。

一、需求获取矩形范围中心点

给了一个Rectangle(w,s,e,n)范围求取中心点。(w,s,e,n为西南东北即西南为经度,东北为纬度格式为[172,14,172,23])。

二、实现过程和方法

方法1:

 使用:Cesium.Rectangle.center(rectangle)这个结果为(Cartographic)然后在转换成(Cartographic3)这样就可以直接使用了。如果想要获得正常的经纬度则需要把Cartographic3转换成正常坐标。

Cesium.Rectangle.center API/各个坐标的转换(区别)/各个坐标之间的转换

 var rectangle = Cesium.Rectangle.fromDegrees(//矩形视角范围
      west,
      south,
      east,
      north,
    );
    var center = Cesium.Rectangle.center(rectangle);//获取视角范围中心点(得到的结果为弧度Cartographic)
    var adre = Cesium.Cartographic.toCartesian(center);//把弧度转换为x,y,z(世界坐标也就是Cartographic3)
    //世界坐标转换成经纬度
    var ellipsoid = viewer.scene.globe.ellipsoid;
    var cartographic = ellipsoid.cartesianToCartographic(adre);
    var lat = Cesium.Math.toDegrees(cartographic.latitude);//纬度
    var lng = Cesium.Math.toDegrees(cartographic.longitude);//经度
  viewer.camera.flyTo({//定位到范围中心点
      destination: Cesium.Cartesian3.fromDegrees(lng,lat),
     //destination: rectangle,
      orientation: {
         heading: Cesium.Math.toRadians(180),//1
         pitch: Cesium.Math.toRadians(-90),
         roll: 0
      }
    });

方法2:

这个方法很简单效果所差无几个。就是经度之和纬度之和取平均值。

    var west = parseFloat(经度);
    var south = parseFloat(纬度);
    var east = parseFloat(经度);
    var north = parseFloat(纬度);
 viewer.camera.flyTo({//定位到范围中心点
      destination: Cesium.Cartesian3.fromDegrees(Number((west + east) / 2), Number((south + north) / 2),2200),
     //destination: rectangle,
      orientation: {
         heading: Cesium.Math.toRadians(180),//1
         pitch: Cesium.Math.toRadians(-90),
         roll: 0
      }
    });

各位有什么错误请指出来或者有更好的方法可以评论。

三、多边形中心点

  1. 首先,获取多边形的边界坐标。假设多边形的边界坐标存储在一个数组 positions 中。
  2. 计算多边形的中心点坐标。可以使用以下代码来计算中心点坐标:
// 初始化中心点坐标
let center = Cesium.Cartesian3.ZERO;
// 计算坐标总数
const count = positions.length;
// 计算坐标总和
positions.forEach(position => {
  center = Cesium.Cartesian3.add(center, position, center);
});
// 取坐标平均值
center = Cesium.Cartesian3.divideByScalar(center, count, center);
// 将中心点坐标转换为地理坐标
const centerCartographic = Cesium.Cartographic.fromCartesian(center);
// 将地理坐标转换为经纬度坐标
const centerLongitude = Cesium.Math.toDegrees(centerCartographic.longitude);
const centerLatitude = Cesium.Math.toDegrees(centerCartographic.latitude);

3.设置相机飞行到中心点位置。可以使用以下代码来设置相机飞行到中心点位置:

// 设置视图中心点和高度
viewer.camera.flyTo({
  destination: Cesium.Cartesian3.fromDegrees(centerLongitude, centerLatitude, 1000), // 设置中心点经纬度和高度
  orientation: {
    heading: Cesium.Math.toRadians(0), // 设置相机的朝向角度
    pitch: Cesium.Math.toRadians(-90), // 设置相机的俯仰角度
    roll: 0 // 设置相机的滚动角度
  },
  duration: 3 // 设置飞行时间,单位为秒
});

  • 2
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

崽崽的谷雨

漫漫前端路,摸爬滚打

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值