Babylon.js 实战心得（一）

1. 如果将屏幕强制横屏，相机旋转的轴向就会变成 左右滑动 – 上下旋转，需要改动源码

从github拉取整个项目，找到src/Caermas下的 arcRotateCamera.ts 代码

找到这两句代码，改完重新打包， 记得判断一下是否在移动端

   this.alpha += inertialAlphaOffset * directionModifier;
   this.beta += this.inertialBetaOffset * directionModifier;

 将上两句代码换成 ：

   this.beta += inertialAlphaOffset * directionModifier;
   this.alpha+= this.inertialBetaOffset * directionModifier;
   

2.第二种强制横屏，轴向解决方案，建议用这种

写一个类，继承 ArcRotateCamera 这个对象，之后重写 _checkInputs（） 这个函数

代码如下：

之后就实例化这个对象即可

class Camera extends ArcRotateCamera {
  _checkInputs() {
  
    if (this._collisionTriggered) {
      return
    }
    this.inputs.checkInputs()
   
    if (
      this.inertialAlphaOffset !== 0 ||
      this.inertialBetaOffset !== 0 ||
      this.inertialRadiusOffset !== 0
    ) {
      const directionModifier = this.invertRotation ? -1 : 1
      let inertialAlphaOffset = this.inertialAlphaOffset
      if (this.beta <= 0) {
        inertialAlphaOffset *= -1
      }
      if (this.getScene().useRightHandedSystem) {
        inertialAlphaOffset *= -1
      }
      if (this.parent && this.parent._getWorldMatrixDeterminant() < 0) {
        inertialAlphaOffset *= -1
      }
      if (Device._isMobile()) {
        this.beta -= inertialAlphaOffset * directionModifier
        this.alpha += this.inertialBetaOffset * directionModifier
      } else {
        this.alpha += inertialAlphaOffset * directionModifier
        this.beta += this.inertialBetaOffset * directionModifier
      }

      this.radius -= this.inertialRadiusOffset
      this.inertialAlphaOffset *= this.inertia
      this.inertialBetaOffset *= this.inertia
      this.inertialRadiusOffset *= this.inertia
      if (Math.abs(this.inertialAlphaOffset) < Epsilon) {
        this.inertialAlphaOffset = 0
      }
      if (Math.abs(this.inertialBetaOffset) < Epsilon) {
        this.inertialBetaOffset = 0
      }
      if (Math.abs(this.inertialRadiusOffset) < this.speed * Epsilon) {
        this.inertialRadiusOffset = 0
      }
    }
  
    if (this.inertialPanningX !== 0 || this.inertialPanningY !== 0) {
      const localDirection = new Vector3(
        this.inertialPanningX,
        this.inertialPanningY,
        this.inertialPanningY
      )
      this._viewMatrix.invertToRef(this._cameraTransformMatrix)
      localDirection.multiplyInPlace(this.panningAxis)
      Vector3.TransformNormalToRef(
        localDirection,
        this._cameraTransformMatrix,
        this._transformedDirection
      )
   
      if (this.mapPanning || !this.panningAxis.y) {
        this._transformedDirection.y = 0
      }
      if (!this._targetHost) {
        if (this.panningDistanceLimit) {
          this._transformedDirection.addInPlace(this._target)
          const distanceSquared = Vector3.DistanceSquared(
            this._transformedDirection,
            this.panningOriginTarget
          )
          if (
            distanceSquared <=
            this.panningDistanceLimit * this.panningDistanceLimit
          ) {
            this._target.copyFrom(this._transformedDirection)
          }
        } else {
          this._target.addInPlace(this._transformedDirection)
        }
      }
      this.inertialPanningX *= this.panningInertia
      this.inertialPanningY *= this.panningInertia
      if (Math.abs(this.inertialPanningX) < this.speed * Epsilon) {
        this.inertialPanningX = 0
      }
      if (Math.abs(this.inertialPanningY) < this.speed * Epsilon) {
        this.inertialPanningY = 0
      }
    }
   
    this._checkLimits()
  }