如何将指南针顶部的箭头指向特定方向。例如沙特阿拉伯现职

Question

我正在使用 angular 创建一个 Ionic 4 应用程序，我想创建一个指向特定方向的指南针。该方向将由罗盘上方的箭头表示。到目前为止，我已经创建了指南针并且指南针工作正常并在其上方放置了一个箭头。应用程序屏幕截图。

我所知道的是我必须计算从当前位置到目标的角度 position.I 已经使用一些堆栈溢出解决方案来查找角度并使用该角度将箭头指向所需位置。但不幸的是我无法获得我想要的角度。

这是确定角度的代码。

  angleFromCoordinate() {
    let lat1 = this.latCoords
    let lon1 = this.lngCoords
    let lat2 = this.destLat;
    let lon2 = this.destLong;
    var p1 = {
      x: lat1,
      y: lon1
    };

    var p2 = {
      x: lat2,
      y: lon2
    };
    var angleDeg = Math.atan2(p2.y - p1.y, p2.x - p1.x) * 180 / Math.PI;
    console.log(angleDeg);
    return angleDeg;
  }

我还希望箭头在设备旋转时也随之移动。我正在使用 ionic 4 的插件 deviceOrientation

旋转我的指南针

  this.deviceSubscription = this.deviceOrientation.watchHeading().subscribe(
      (data: DeviceOrientationCompassHeading) => {
        //to torate compass
        this.rotateCompass(data.magneticHeading);
        //to rotate the arrow
        this.rotateArrow(data.magneticHeading);
      }
    );

Answer 1

我让它工作正常。如果有人正在寻找这个问题的解决方案，我只想说清楚，上面提到的用于获取从一点到另一点的角度的代码工作正常。获取角度的代码。

angleFromCoordinate() {
    let lat1 = this.latCoords
    let lon1 = this.lngCoords
    let lat2 = this.destLat;
    let lon2 = this.destLong;
    var p1 = {
      x: lat1,
      y: lon1
    };

    var p2 = {
      x: lat2,
      y: lon2
    };
    var angleDeg = Math.atan2(p2.y - p1.y, p2.x - p1.x) * 180 / Math.PI;
    console.log(angleDeg);
    return angleDeg;
  }

此方法returns角度，您可以使用此角度将指南针指向所需位置。

如何将指南针顶部的箭头指向特定方向。例如沙特阿拉伯现职

how to direct an arrow on top of compass to point towards specific direction. for e.g. current position to Saudi Arabia

javascript

compass-geolocation

hybrid-mobile-app

ionic-framework