一，视角漫游（键盘操控）

1.完整代码

// 漫游
    freeden() {
      let Cesium = this.cesium;
      let ellipsoid = viewer.scene.globe.ellipsoid;
      let scene = viewer.scene;
      // 关闭鼠标相机事件
      scene.screenSpaceCameraController.enableRotate = false; // 是否可以旋转地图,只在2d和2.5d场景里生效
      scene.screenSpaceCameraController.enableTranslate = false; // 是否可以拖动地图,只在2d和2.5d场景里生效
      scene.screenSpaceCameraController.enableZoom = false; //是否可以缩放
      scene.screenSpaceCameraController.enableTilt = false; // 是否可以倾斜地图,只在3d和2.5d场景生效
      scene.screenSpaceCameraController.enableLook = false; // 是否允许使用自由外观,只改变相机的朝向，不改变相机位置
​
      let startMousePosition;//起始的屏幕坐标
      let mousePosition;// 按下鼠标后移动的目标位置的屏幕坐标
      // 小车状态标志
      let flags = {
        looking: false,  // 镜头旋转
        moveForward: false,
        moveBackward: false,
        moveUp: false,
        moveDown: false,
        moveLeft: false,
        moveRight: false,
        rotateRight: false,
        rotateLeft: false,
      };
      // 鼠标按下
      viewer.screenSpaceEventHandler.setInputAction(function (movement) {
        flags.looking = true; 
        // mousePosition = startMousePosition = Cesium.Cartesian3.clone(  //clone坐标点拷贝
        //   movement.position
        // );  
        mousePosition = startMousePosition = movement.position;// 获取屏幕坐标
      }, Cesium.ScreenSpaceEventType.LEFT_DOWN);
      // 鼠标移动
      viewer.screenSpaceEventHandler.setInputAction(function (movement) {
        mousePosition = movement.endPosition; // 移动结束时的屏幕坐标
      }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
      // 鼠标抬起
      viewer.screenSpaceEventHandler.setInputAction(function () {
        flags.looking = false;   // 镜头旋转关闭
      }, Cesium.ScreenSpaceEventType.LEFT_UP);
      // 监听键盘绑定事件
      function getFlagForKeyCode(keyCode) {
        switch (keyCode) {
          case "W".charCodeAt(0): //前 "W".charCodeAt(0) W的键值87
            return "moveForward";
          case "S".charCodeAt(0): //后
            return "moveBackward";
          case "Q".charCodeAt(0): //上
            return "moveUp";
          case "E".charCodeAt(0): // 下
            return "moveDown";
          case "D".charCodeAt(0): // 右
            return "moveRight";
          case "A".charCodeAt(0): // 左
            return "moveLeft";
          case "X".charCodeAt(0):
            return "rotateRight"; //右转
          case "Z".charCodeAt(0):
            return "rotateLeft"; //左转
          default:
            return undefined;
        }
      }
      // 键盘按下事件
      document.addEventListener(
        "keydown",
        (this.down = function (e) { // e:键盘的按键
        console.log("11","W".charCodeAt(0));
          let flagName = getFlagForKeyCode(e.keyCode); //  e.keyCode 键盘的键值
          if (typeof flagName !== "undefined") {   // typeof运算符用于判断对象的类型
            flags[flagName] = true;
          }
        }),
        false
      );
       // 键盘按键抬起事件
      document.addEventListener(
        "keyup",
        (this.up = (e) => {
          let flagName = getFlagForKeyCode(e.keyCode);
          if (typeof flagName !== "undefined") {
            flags[flagName] = false;
          }
        }),
        false
      );
     
      viewer.clock.onTick.addEventListener(function (clock) {
        //回调函数，时间变化就执行（即使停止时间轴仍然会执行。。。。）
        // 获取当前时间
        let camera = viewer.camera;
        // 镜头旋转
        if (flags.looking) {
          let width = viewer.canvas.clientWidth;// canvas可见区域宽
          let height = viewer.canvas.clientHeight;// 可见区域高 
          let lookFactor = 0.06;
          let x = (mousePosition.x - startMousePosition.x) / width;
          // 目标坐标的x坐标减去开始坐标的x除以x的最大值（也就是canvas的宽度）得到移动的距离与宽度的比值
          let y = -(mousePosition.y - startMousePosition.y) / height;
          // 相机直接定位
          camera.setView({
            orientation: {
              heading: camera.heading + x * lookFactor,
              pitch: camera.pitch + y * lookFactor,
              roll: 0.0,
            },
          });
        }
​
        // 根据高度来决定镜头移动的速度
        let cameraHeight = ellipsoid.cartesianToCartographic(
          camera.position
        ).height;
        let moveRate = cameraHeight / 30.0;
​
        if (flags.moveForward) {
          camera.moveForward(moveRate);
        }
        if (flags.moveBackward) {
          camera.moveBackward(moveRate);
        }
        if (flags.moveUp) {
          camera.moveUp(moveRate);
        }
        if (flags.moveDown) {
          camera.moveDown(moveRate);
        }
        if (flags.moveLeft) {
          camera.moveLeft(moveRate);
        }
        if (flags.moveRight) {
          camera.moveRight(moveRate);
        }
        if (flags.rotateRight) {
          //获取当前坐标，以此为中间轴，进行旋转
          let post = viewer.camera.position;
          let axis = new Cesium .Cartesian3(
            Number(post.x),
            Number(post.y),
            Number(post.z)
          );
          camera.rotate(axis, 0.01);
        }
        if (flags.rotateLeft) {
          //获取当前坐标，以此为中间轴，进行旋转
          let post = viewer.camera.position;
          let axis = new Cesium.Cartesian3(
            Number(post.x),
            Number(post.y),
            Number(post.z)
          );
          camera.rotate(axis, -0.01);
        }
      });
    },

二，视角漫游（鼠标操控）

1.完整代码

<template>
  <div id="Hospital">
    <div id="cesium"></div>
    <div id="cesium_label" v-show="this.Roam == '进入漫游'">
      <el-tooltip
        class="item"
        effect="dark"
        content="返回地图"
        placement="left"
      >
        <i
          @click="retureRoam()"
          id="icon_style"
          class="iconfont icon-fanhui"
        ></i>
      </el-tooltip>
    </div>
    <div id="cesium_label2" v-show="this.Roam == '进入漫游'">
      <el-tooltip
        class="item"
        effect="dark"
        content="进入漫游"
        placement="left"
      >
        <i @click="showRoam()" id="icon_style" class="iconfont icon-manyou"></i>
      </el-tooltip>
    </div>
    <div id="cesium_label3" v-show="this.Roam !== '进入漫游'">
      <el-tooltip
        class="item"
        effect="dark"
        content="退出漫游"
        placement="left"
      >
        <i
          @click="outRoam()"
          id="icon_style"
          class="iconfont icon-tuichumanyou"
        ></i>
      </el-tooltip>
    </div>
  </div>
</template>
​
<script>
let viewer;
import { getPoints } from "@/api/apis.js";
export default {
  data() {
    return {
      floorHeight: "",
      point: [], //广告牌
      viewer: null,
      BillboardName: "", //广告牌名字
      monitorEntity: null,
      AllPoint: [],
      x: "",
      y: "",
      z: "",
      Roam: "进入漫游",
      points: [],
    };
  },
  name: "Hospital",
  components: {},
  mounted() {
    this.getData();
  },
  methods: {
    init() {
      let Cesium = this.cesium;
      viewer = new Cesium.Viewer("cesium", {
        animation: false, //是否创建动画小器件，左下角仪表
        baseLayerPicker: false, //是否显示图层选择器
        fullscreenButton: false, //是否显示全屏按钮
        geocoder: false, //是否显示geocoder小器件，右上角查询按钮
        homeButton: false, //是否显示Home按钮
        infoBox: false, //是否显示信息框
        sceneModePicker: false, //是否显示3D/2D选择器
        selectionIndicator: false, //是否显示选取指示器组件
        timeline: false, //是否显示时间轴
        navigationHelpButton: false, //是否显示右上角的帮助按钮
      });
      viewer._cesiumWidget._creditContainer.style.display = "none"; //去掉版权信息
      viewer.scene.sun.show = false; //在Cesium1.6(不确定)之后的版本会显示太阳和月亮，不关闭会影响展示
      viewer.scene.moon.show = false;
      viewer.scene.skyAtmosphere.show = false; //隐藏大气圈
      viewer.scene.skyBox.show = true; //天空盒的显影
      viewer.scene.globe.show = false; //地球的显示
      viewer.scene.globe.enableLighting = false; // 开启全球光照
      viewer.shadows = false;
      // 星空背景
      viewer.scene.skyBox = new Cesium.SkyBox({
        sources: {
          positiveX:
            "http://81.68.73.55/group1/M00/00/05/rBEAA1-ksPKAcNylACNu1lQm8u8356.png",
          negativeX:
            "http://81.68.73.55/group1/M00/00/05/rBEAA1-ksK6AZXxwABvSzSIL87Y975.png",
          positiveY:
            "http://81.68.73.55/group1/M00/00/05/rBEAA1-ksF-AKN6uAB0nITX6ytY508.png",
          negativeY:
            "http://81.68.73.55/group1/M00/00/05/rBEAA1-ksWWATYKJACsujon32-c647.png",
          positiveZ:
            "http://81.68.73.55/group1/M00/00/05/rBEAA1-ksH-ACw_hABhT2WaTM2Q296.png",
          negativeZ:
            "http://81.68.73.55/group1/M00/00/05/rBEAA1-ksCGAAkQ3AB26d_3SVig888.png",
        },
      });
      //是否开启抗锯齿
      viewer.scene.fxaa = true;
      viewer.scene.postProcessStages.fxaa.enabled = true;
      // 加载工厂模型
      let tileset = viewer.scene.primitives.add(
        new Cesium.Cesium3DTileset({
          url: "http://60.205.226.243:9000/factory/tileset.json",
        })
      );
      viewer.zoomTo(tileset);
      //   // //增加点位
      //    let handlers = new Cesium.ScreenSpaceEventHandler(
      //       viewer.scene.canvas
      //   );
      //   let screenPoints = [];   //屏幕坐标
      //   let cesiumPoints = [];
      //      handlers.setInputAction((e) => {
      //     screenPoints.push({ x: e.position.x, y: e.position.y });
      //     console.log("屏幕坐标:", "[" + e.position.x + ", " + e.position.y + "]");
      //     let position =   viewer.scene.pickPosition(e.position);
      //     //将笛卡尔坐标转化为经纬度坐标
      //     let cartographic = Cesium.Cartographic.fromCartesian(position);
      //     let longitude = Cesium.Math.toDegrees(cartographic.longitude);
      //     let latitude = Cesium.Math.toDegrees(cartographic.latitude);
      //     let height = cartographic.height;
      //     console.log("Cartesian3: ", "["+ longitude + ", " + latitude + ", " + height + "]")
      //     cesiumPoints.push({ x: longitude, y: latitude, z: height });
​
      //       viewer.entities.add({
      //       position: Cesium.Cartesian3.fromDegrees(longitude, latitude, height),
      //       billboard: {
      //         image: "static/img/发电点.png", // default: undefined
      //         show: true, // default
      //         pixelOffset: new Cesium.Cartesian2(0, -14), // default: (0, 0)
      //         eyeOffset: new Cesium.Cartesian3(0.0, 0.0, 0.0), // default
      //         // horizontalOrigin: Cesium.HorizontalOrigin.CENTER, // default
      //         // verticalOrigin: Cesium.VerticalOrigin.BOTTOM, // default: CENTER
      //         scale: 1.0, // default: 1.0
      //         // color: Cesium.Color.LIME, // default: WHITE
      //         // rotation: Cesium.Math.PI_OVER_FOUR, // default: 0.0
      //         // alignedAxis: Cesium.Cartesian3.ZERO, // default
      //         width: 20, // default: undefined
      //         height: 30, // default: undefined
      //       },
      //     });
      //   }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
      //   console.log("cartesian3: ", cesiumPoints)
      let handlerVideo = new Cesium.ScreenSpaceEventHandler(
        viewer.scene.canvas
      );
      // 鼠标点击广告牌
      handlerVideo.setInputAction((click) => {
        let picktwo = viewer.scene.pick(click.position);
        if (
          picktwo &&
          picktwo.id &&
          picktwo.primitive._pickPrimitive !== undefined
        ) {
          if (picktwo.id._name == "上北") {
            // console.log("this.AllPoint1111", this.AllPoint);
            this.x = this.AllPoint[0].n.x;
            this.y = this.AllPoint[0].n.y;
            this.z = this.AllPoint[0].n.z;
            this.cameraView(
              this.AllPoint[0].n.x,
              this.AllPoint[0].n.y,
              2,
              0,
              -10,
              0
            );
            // this.cameraView( 114.50281620427792,36.618503980890935,2,0,-10,0)
          } else if (picktwo.id._name == "右东") {
            this.x = this.AllPoint[0].e.x;
            this.y = this.AllPoint[0].e.y;
            this.z = this.AllPoint[0].e.z;
            this.cameraView(
              this.AllPoint[0].e.x,
              this.AllPoint[0].e.y,
              2,
              0,
              -10,
              0
            );
            // this.cameraView( 114.50279718429029,36.61824910107514,2,0,-10,0)
          } else if (picktwo.id._name == "下南") {
            this.x = this.AllPoint[0].s.x;
            this.y = this.AllPoint[0].s.y;
            this.z = this.AllPoint[0].s.z;
            this.cameraView(
              this.AllPoint[0].s.x,
              this.AllPoint[0].s.y,
              2,
              0,
              -10,
              0
            );
            // this.cameraView( 114.50279338979793,36.6182775554564,2,0,-10,0)
          } else if (picktwo.id._name == "左西") {
            this.x = this.AllPoint[0].w.x;
            this.y = this.AllPoint[0].w.y;
            this.z = this.AllPoint[0].w.z;
            this.cameraView(
              this.AllPoint[0].w.x,
              this.AllPoint[0].w.y,
              2,
              0,
              -10,
              0
            );
            // this.cameraView(  114.502665336036,36.61839353576705,2,0,-10,0)
          }
          const params = {
            x: this.x,
            y: this.y,
            z: this.z,
          };
          this.GetPoint(params);
        }
      }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
      // 鼠标移入广告牌
      handlerVideo.setInputAction((movement) => {
        if (viewer.scene.mode !== Cesium.SceneMode.MORPHING) {
          let pickedObject = viewer.scene.pick(movement.endPosition);
          if (
            viewer.scene.pickPositionSupported &&
            Cesium.defined(pickedObject) &&
            pickedObject.id !== ""
          ) {
            document.getElementById("cesium").style.cursor = "pointer";
            // }
          } else {
            document.getElementById("cesium").style.cursor = "default";
          }
        }
      }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
      // 禁止鼠标左键拖动地图、中键转换视角
      // viewer.scene.screenSpaceCameraController.tiltEventTypes = [];
      // viewer.scene.screenSpaceCameraController.enableRotate=false;
      // //禁止左键按下视角平移；
      // viewer.scene.screenSpaceCameraController.enableRotate = false;
      // // 禁止中键缩放视角；
      // viewer.scene.screenSpaceCameraController.enableZoom = false;
      // // 禁止控制视角旋转：?
      // viewer.scene.screenSpaceCameraController.enableTilt = true;
​
      document.getElementById("cesium_label2").style.backgroundColor =
        "rgba(57, 149, 195, 0.5)";
      document.getElementById("cesium_label3").style.backgroundColor =
        "rgba(57, 149, 195, 0.5)";
      this.cameraView(116.39244, 39.90587, 100.57, 0.0, -28.11, 0); //回到模型的相机角度
    },
    getData() {
      this.init();
    },
    // 进入漫游
    showRoam() {
      this.Roam = "退出漫游";
      this.AllPoint = [];
      const param = {
        x: 116.39220160422464,
        y: 39.90712204709374,
        z: 1.12026313103057,
      };
      this.GetPoint(param); //定位到漫游的起始点
      // this.prohibit();// 禁止鼠标拖拽
    },
    // 退出漫游
    outRoam() {
      this.Roam = "进入漫游";
      this.cameraView(116.39244, 39.90587, 100.57, 0.0, -28.11, 0); //回到模型的相机角度
      this.clearPonit(); // 消除所有的广告牌
      this.open();
    },
    // 切换点位
    GetPoint(params) {
      // console.log("params", params);
      getPoints(params).then((res) => {
        // console.log("res", res);
        this.AllPoint = [];
        this.point = [];
        this.point = res.data;
        this.pushPoint();
      });
    },
    // 加载点位周边的4个方向键
    pushPoint() {
      this.AllPoint.push({
        point: {
          ["x"]: this.point.position.x,
          ["y"]: this.point.position.y,
          ["z"]: this.point.position.z,
        },
        points: [],
        n: this.point.n,
        e: this.point.e,
        s: this.point.s,
        w: this.point.w,
      });
      for (let index = 0; index < this.AllPoint.length; index++) {
        const each = this.AllPoint[index];
        const forMap = [
          { x: 0, y: 0.00001, name: "上北", image: "static/img/上北.png" },
          { x: 0.00001, y: 0, name: "右东", image: "static/img/右东.png" },
          { x: 0, y: -0.00001, name: "下南", image: "static/img/下南.png" },
          { x: -0.00001, y: 0, name: "左西", image: "static/img/左西.png" },
        ];
        for (let index = 0; index < forMap.length; index++) {
          const mapItem = forMap[index];
          let northPoint = {};
          northPoint.x = each.point.x + mapItem.x;
          northPoint.y = each.point.y + mapItem.y;
          northPoint.z = each.point.z;
          northPoint.name = mapItem.name;
          northPoint.image = mapItem.image;
          each.points.push(northPoint);
          // console.log("northPoint",northPoint);
        }
      }
      // console.log("this.AllPoint", this.AllPoint);
      this.getBillboard();
    },
    // 加载广告牌
    getBillboard() {
      let Cesium = this.cesium;
      this.clearPonit();
      this.AllPoint[0].points.forEach((item) => {
        // console.log("item", item);
        this.monitorEntity = viewer.entities.add({
          id: item.name,
          name: item.name,
          position: Cesium.Cartesian3.fromDegrees(item.x, item.y, 2),
          billboard: {
            //图标
            image: item.image,
            width: 50,
            height: 50,
          },
        });
      });
      if (JSON.stringify(this.AllPoint[0].n.x) == 0) {
        viewer.entities.remove({ id: "上北" });
      }
      if (JSON.stringify(this.AllPoint[0].e.x) == 0) {
        viewer.entities.remove({ id: "右东" });
      }
      if (JSON.stringify(this.AllPoint[0].s.x) == 0) {
        viewer.entities.remove({ id: "下南" });
      }
      if (JSON.stringify(this.AllPoint[0].w.x) == 0) {
        viewer.entities.remove({ id: "左西" });
      }
      // 视角
      this.cameraView(
        this.AllPoint[0].point.x,
        this.AllPoint[0].point.y - 0.0001,
        5,
        0,
        -5,
        0
      );
    },
    // 清除广告牌
    clearPonit() {
      viewer.entities.remove({ id: "上北" }); //销毁所有的广告牌
      viewer.entities.remove({ id: "右东" });
      viewer.entities.remove({ id: "下南" });
      viewer.entities.remove({ id: "左西" });
    },
    // 清除点位广告牌
    clearPonits() {
      viewer.entities.remove({ id: "1" });
    },
    // 禁止鼠标拖拽
    prohibit() {
      // 禁止左键按下视角平移；
      viewer.scene.screenSpaceCameraController.enableRotate = false;
      // 禁止中键缩放视角；
      viewer.scene.screenSpaceCameraController.enableZoom = false;
    },
    // 启用鼠标
    open() {
      // 左键按下视角平移；
      viewer.scene.screenSpaceCameraController.enableRotate = true;
      // 中键缩放视角；
      viewer.scene.screenSpaceCameraController.enableZoom = true;
    },
    //点击移动位置
    movePoint() {
      // console.log("移动位置");
    },
    // 返回地图
    retureRoam() {
      this.$router.push({ path: "/" });
    },
    // 相机视角
    cameraView(lon, lat, alt, heading, pitch, roll) {
      let Cesium = this.cesium;
      viewer.camera.flyTo({
        destination: Cesium.Cartesian3.fromDegrees(lon, lat, alt),
        orientation: {
          heading: Cesium.Math.toRadians(heading),
          pitch: Cesium.Math.toRadians(pitch),
          roll: roll,
        },
      });
    },
  },
};
</script>
​
<style scoped>
#cesium_label {
  cursor: pointer;
  position: absolute;
  z-index: 3;
  right: 300px;
  top: 120px;
  width: 40px;
  height: 40px;
  background-color: rgba(57, 149, 195, 0.1);
  border: 1px solid rgba(27, 97, 133, 0.5);
  backdrop-filter: blur(8px);
  text-align: center;
  line-height: 40px;
}
#cesium_label2 {
  cursor: pointer;
  position: absolute;
  z-index: 3;
  right: 300px;
  top: 160px;
  width: 40px;
  height: 40px;
  background-color: rgba(57, 149, 195, 0.1);
  border: 1px solid rgba(27, 97, 133, 0.5);
  backdrop-filter: blur(8px);
  text-align: center;
  line-height: 40px;
}
#cesium_label3 {
  cursor: pointer;
  position: absolute;
  z-index: 3;
  right: 300px;
  top: 200px;
  width: 40px;
  height: 40px;
  background-color: rgba(57, 149, 195, 0.1);
  border: 1px solid rgba(27, 97, 133, 0.5);
  backdrop-filter: blur(8px);
  text-align: center;
  line-height: 40px;
}
</style>
​

三，小车移动（视角跟随小车的移动而移动）

1.完整代码

  freeden() {
      let Cesium = this.cesium;
      //   let newStr =[parseFloat(str[0].substring(2)),parseFloat(str[1].substring(2)),parseFloat(str[2].substring(2))]
      // 小车旋转角度
      let radian = Cesium.Math.toRadians(2.0);
      // 小车的速度
      let speed = 0.2;
      // 速度矢量
      let speedVector = new Cesium.Cartesian3();
      let scene = viewer.scene;
      // 起始位置
      //   let position = Cesium.Cartesian3.fromDegrees(newStr[0],newStr[1],newStr[2])
      let position = Cesium.Cartesian3.fromDegrees(
        116.39221112114365,
        39.90715939387469,
        2.1997590096043507
      );
​
      // 用于设置小车方向
      let hpRoll = new Cesium.HeadingPitchRoll();
      let fixedFrameTransforms =
        Cesium.Transforms.localFrameToFixedFrameGenerator("north", "west");
      // 添加小车模型
      let carPrimitive = scene.primitives.add(
        Cesium.Model.fromGltf({
          id: "mycar",
          url: "static/BoomBox.glb",
          modelMatrix: Cesium.Transforms.headingPitchRollToFixedFrame(
            position,
            hpRoll,
            Cesium.Ellipsoid.WGS84,
            fixedFrameTransforms
          ),
          minimumPixelSize: 128,
        })
      );
      this.model = carPrimitive;
​
      // 小车状态标志
      let flag = {
        moveUp: false,
        moveDown: false,
        moveLeft: false,
        moveRight: false,
      };
      // 根据键盘按键返回标志
      function setFlagStatus(key, value) {
        switch (key.keyCode) {
          case 65:
            // 左
            flag.moveLeft = value;
            break;
          case 87:
            // 上
            flag.moveUp = value;
            break;
          case 68:
            // 右
            flag.moveRight = value;
            break;
          case 83:
            flag.moveDown = value;
            // 下
            break;
        }
      }
      document.addEventListener("keydown", (e) => {
        setFlagStatus(e, true);
      });
​
      document.addEventListener("keyup", (e) => {
        setFlagStatus(e, false);
      });
      // moveCar(true);
      var count = 0;
      viewer.clock.onTick.addEventListener((clock) => {
        if (flag.moveUp) {
          if (flag.moveLeft) {
            hpRoll.heading -= radian;
            count += 2;
          }
          if (flag.moveRight) {
            hpRoll.heading += radian;
            count -= 2;
          }
          moveCar(1);
        } else if (flag.moveDown) {
          if (flag.moveLeft) {
            hpRoll.heading -= radian;
            count += 2;
          }
          if (flag.moveRight) {
            hpRoll.heading += radian;
            count -= 2;
          }
          moveCar(-1);
        } else {
          if (flag.moveLeft) {
            hpRoll.heading -= radian;
            count += 2;
            moveCar(0);
          }
          if (flag.moveRight) {
            hpRoll.heading += radian;
            count -= 2;
            moveCar(0);
          }
        }
      });
​
      // 移动小车
      function moveCar(isUP) {
        // 计算速度矩阵
        if (isUP === 1) {
          speedVector = Cesium.Cartesian3.multiplyByScalar(
            Cesium.Cartesian3.UNIT_X,
            speed,
            speedVector
          );
        } else if (isUP === -1) {
          speedVector = Cesium.Cartesian3.multiplyByScalar(
            Cesium.Cartesian3.UNIT_X,
            -speed,
            speedVector
          );
        } else {
          speedVector = Cesium.Cartesian3.multiplyByScalar(
            Cesium.Cartesian3.UNIT_X,
            0,
            speedVector
          );
        }
​
        // 根据速度计算出下一个位置的坐标
        position = Cesium.Matrix4.multiplyByPoint(
          carPrimitive.modelMatrix,
          speedVector,
          position
        );
​
        // 小车移动
        Cesium.Transforms.headingPitchRollToFixedFrame(
          position,
          hpRoll,
          Cesium.Ellipsoid.WGS84,
          fixedFrameTransforms,
          carPrimitive.modelMatrix
        );
​
​
      // 视角跟随小车的移动
       var cartesian3 = new Cesium.Cartesian3(
          position.x,
          position.y,
          position.z
        );
        var cartographic =
          viewer.scene.globe.ellipsoid.cartesianToCartographic(cartesian3);
        var lng =
          Cesium.Math.toDegrees(cartographic.longitude) +
          0.00001852398509 * 5 * Math.cos(((270 + count) * 2 * Math.PI) / 360);
        var lat =
          Cesium.Math.toDegrees(cartographic.latitude) +
          0.00001852398509 * 5 * Math.sin(((270 + count) * 2 * Math.PI) / 360);
        var alt = cartographic.height + 5;
        // 获取指定经纬度的高程
        //这部分是想要获取高程来实现贴地，目前这一块还没完善，有需求的可以借鉴一下
        // var toH=new Cesium.Cartographic.fromDegrees(lng,lat)
        // var h2 = viewer.scene.sampleHeight(toH)
​
        viewer.camera.setView({
          destination: Cesium.Cartesian3.fromDegrees(lng, lat, alt),
          orientation: {
            // 指向  镜头随小车变化角度
            heading: hpRoll.heading,
            // 视角固定
            pitch: Cesium.Math.toRadians(-15.0),
            roll: 0.0,
          }, 
        });
      }
      this.hideCar = 3;
              //计算相机位置
        
​
      //  viewer.trackedEntity = carPrimitive
      //       viewer.clock.shouldAnimate = true
      //       carPrimitive.viewFrom = new Cesium.Cartesian3(-200,400,200)
    },

\