• mars3D使用需要 import以下文件

  • mars3D获取可视化范围API getExtent()

    1. import * as mars3d from 'mars3d'
    2. import * as Cesium from 'mars3d-cesium'

    查看graphic是否在可视范围内

    1. /* 相机移动结束事件 */
    2. this.map.on(mars3d.EventType.cameraMoveEnd,  (event) => {
    3. // 相机移动，获取屏幕范围
    4. this.cameraScreen = this.getViewExtend();
    5. });
    6. // 滚轮变化时， 获取屏幕范围
    7. this.map.on(mars3d.EventType.wheel,  (event) => {
    8. this.cameraScreen = this.getViewExtend();   
    9. });
    1. // 获取当前车辆的经度和维度，用于判断是否再当前屏幕范围内
    2. let lon = data.lon;
    3. let lat = data.lat;
    4. // 找到了车辆，但没在屏幕范围，就移除车辆
    5. if(lon > this.cameraScreen.maxx || lon < this.cameraScreen.minx || lat > this.cameraScreen.maxy || lat < this.cameraScreen.miny) {
    6.    carGraphic.remove();
    7.    return;
    8. }

    获取可视化范围

    20210831182214214.png

    1. getViewExtend() {
    2. let params = {};
    3. let extend = viewer.camera.computeViewRectangle();
    4. if (typeof extend === "undefined") {
    5.   //2D下会可能拾取不到坐标，extend返回undefined,因此作如下转换
    6.   let canvas = viewer.scene.canvas;
    7.   let upperLeft = new Cesium.Cartesian2(0, 0);//canvas左上角坐标转2d坐标
    8.   let lowerRight = new Cesium.Cartesian2(
    9.     canvas.clientWidth,
    10.     canvas.clientHeight
    11.   );//canvas右下角坐标转2d坐标
    13.   let ellipsoid = viewer.scene.globe.ellipsoid;
    14.   let upperLeft3 = viewer.camera.pickEllipsoid(
    15.     upperLeft,
    16.     ellipsoid
    17.   );//2D转3D世界坐标
    19.   let lowerRight3 = viewer.camera.pickEllipsoid(
    20.     lowerRight,
    21.     ellipsoid
    22.   );//2D转3D世界坐标
    24.   let upperLeftCartographic = viewer.scene.globe.ellipsoid.cartesianToCartographic(
    25.     upperLeft3
    26.   );//3D世界坐标转弧度
    27.   let lowerRightCartographic= viewer.scene.globe.ellipsoid.cartesianToCartographic(
    28.     lowerRight3
    29.   );//3D世界坐标转弧度
    31.   let minx = Cesium.Math.toDegrees(upperLeftCartographic.longitude);//弧度转经纬度
    32.   let maxx = Cesium.Math.toDegrees(lowerRightCartographic.longitude);//弧度转经纬度
    34.   let miny = Cesium.Math.toDegrees(lowerRightCartographic.latitude);//弧度转经纬度
    35.   let maxy = Cesium.Math.toDegrees(upperLeftCartographic.latitude);//弧度转经纬度
    37.   console.log("经度：" + minx + "----" + maxx);
    38.   console.log("纬度：" + miny + "----" + maxy);
    40.   params.minx = minx;
    41.   params.maxx = maxx;
    42.   params.miny = miny;
    43.   params.maxy = maxy;
    44. } else {
    45.   //3D获取方式
    46.   params.maxx = Cesium.Math.toDegrees(extend.east);
    47.   params.maxy = Cesium.Math.toDegrees(extend.north);
    49.   params.minx = Cesium.Math.toDegrees(extend.west);
    50.   params.miny = Cesium.Math.toDegrees(extend.south);
    51. }
    52. return params;//返回屏幕所在经纬度范围
    53. }