cesium获取当前屏幕可视区域及level层

        在查看cesium文档时,根本找不到对应的获取层级的api,因为在三维区域只能获取到相机的高度,为此通过相机高度计算level层。具体代码去下:

在onUnmounted中定义鼠标事件

  const viewer = cesiumGather.cesiumViewer;
  const handle3D = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);  
  //监听鼠标滚轮事件
  handle3D.setInputAction(() => {
    var level = Math.ceil(viewer.camera.positionCartographic.height);
    getHeightByLevel(level);
    getViewExtend();
  }, Cesium.ScreenSpaceEventType.WHEEL);

通过相机高度计算层级

// 获取level层
const getHeightByLevel = (level) => {
  var A = 40487.57;
  var B = 0.00007096758;
  var C = 91610.74;
  var D = -40467.74;
  console.log(
    "获取level层级" + Math.round(D + (A - D) / (1 + Math.pow(level / C, B)))
  );
  return Math.round(D + (A - D) / (1 + Math.pow(level / C, B)));
};

获取当前屏幕的可视区域的经纬度

// 获取当前屏幕的可视区域的经纬度【2D和3D】
const getViewExtend = () => {
  let params = {};
  const viewer = cesiumGather.cesiumViewer;
  let extend = viewer.camera.computeViewRectangle();
  if (typeof extend === "undefined") {
    //2D下会可能拾取不到坐标,extend返回undefined,所以做以下转换
    let canvas = window.cesiumViewer.scene.canvas;
    let upperLeft = new Cesium.Cartesian2(0, 0); //canvas左上角坐标转2d坐标
    let lowerRight = new Cesium.Cartesian2(
      canvas.clientWidth,
      canvas.clientHeight
    ); //canvas右下角坐标转2d坐标
    let ellipsoid = window.cesiumViewer.scene.globe.ellipsoid;
    let upperLeft3 = window.cesiumViewer.camera.pickEllipsoid(
      upperLeft,
      ellipsoid
    ); //2D转3D世界坐标

    let lowerRight3 = window.cesiumViewer.camera.pickEllipsoid(
      lowerRight,
      ellipsoid
    ); //2D转3D世界坐标

    let upperLeftCartographic =
      window.cesiumViewer.scene.globe.ellipsoid.cartesianToCartographic(
        upperLeft3
      ); //3D世界坐标转弧度
    let lowerRightCartographic =
      window.cesiumViewer.scene.globe.ellipsoid.cartesianToCartographic(
        lowerRight3
      ); //3D世界坐标转弧度

    let minx = Cesium.Math.toDegrees(upperLeftCartographic.longitude); //弧度转经纬度
    let maxx = Cesium.Math.toDegrees(lowerRightCartographic.longitude); //弧度转经纬度

    let miny = Cesium.Math.toDegrees(lowerRightCartographic.latitude); //弧度转经纬度
    let maxy = Cesium.Math.toDegrees(upperLeftCartographic.latitude); //弧度转经纬度
    params.minx = minx;
    params.maxx = maxx;
    params.miny = miny;
    params.maxy = maxy;
  } else {
    //3D获取方式
    params.maxx = Cesium.Math.toDegrees(extend.east);
    params.maxy = Cesium.Math.toDegrees(extend.north);

    params.minx = Cesium.Math.toDegrees(extend.west);
    params.miny = Cesium.Math.toDegrees(extend.south);
  }
  console.log(params, "---------------ssss-----");
  return params; //返回屏幕所在经纬度范围
};

猜你喜欢

转载自blog.csdn.net/qq_43474235/article/details/129782253