Create a point in a direction In Cesiumjs

[crocsx...@gmail.com]

I am using CesiumJs. I would like to create point D at distance C from point A using the direction B


    Point A => start Position (CartographicPosition {latitude, longitude; altitude})
    Direction B => direction from A (HeadingPitchRoll {heading, pitch, roll})
    Distance C => in meters


I am trying to get the rotation an object is facing, and create a point in front of him.


My current implementation is


      public createROIfromRotation(position: Cartographic, rotation: HeadingPitchRoll): Cartographic {
    
        const pos = Cesium.Ellipsoid.WGS84.cartographicToCartesian(position);
        const quat = Cesium.Transforms.headingPitchRollQuaternion(pos, rotation);
        const rot = CesiumMath.QuaternionToEuler(quat);
    
        const dir = Cesium.Cartesian3.multiplyByScalar(rot, 10, new Cesium.Cartesian3());
        const roiPos = Cesium.Cartesian3.add(pos, dir, new Cesium.Cartesian3());
    
    
        return Cesium.Ellipsoid.WGS84.cartesianToCartographic(roiPos);
      }

But it is not rotating around the object, it is doing some kind of curve in different planes.

I would like the red point to be always in front of the truck at 10 meters distance
[Exemple][1]


  [1]: https://cesiumjs.org/Cesium/Build/Apps/Sandcastle/#c=rVZbb9s2FP4rXF4srQol3xI4doKladAE2LouMdoXv9ASbROlSZWkHNtD/vuOqIspO3Y7bEaAiIffOecjz40rotCK0Req0DUS9AXdUc2yJf5iZV4rtss7KQxhgqpWgP6eCAQ/JmbyvVyjKzQjXNOgkGrKaWyYFI8iYTExUu0DFiSRLxqkRmU7ocx4civYkhhabk3Eqz+ciIlYAcO/MthQAuyO5X3GLdlZJqwn5H23u/DpV+RynQUlCRPz4U5CjGEmS6gjmhLxzXqpBIZqA8Zrk3iNfnVWG/TOWW0bey+lXTZDnjVzgyLcGwyAFQpDpIFMxoliZgNMkJDKLFAqOS208l9JGfx3wPIfxCwwMUR0PIdO4Hr0hzvl6nSgbTU/P6IQdRxAflbYjErR6x7bETo/QVfL7ATd8//G9/xfM2b6E/nklQT8Ou5VFPX39Ykgrof76E0DvWmG/AC9baCbSbAdvnU/ztV09vKpkUFwE839JvEtClC7xOSkq6+tP8xD9lD4O54SBIJqCeQBL3QqyMGlH6W8/gHlzQnK633KubM6uMWHoiZTwu1Fd0QBYUZE18vxQXWxQc0+z6vXqlnomIr8yEVbw3YJ+/Y/nnM5pTihqVmM4RJu59DWtBlTpeADlPLWYxtCnmW/FDqaLFNOHyibL8xzlqZQuTSpcy6WQkNZYC7nXmu8YBpNFXQ46FGJpBrqHIqnUEKuIdxqkE6lZrabXR+eGs+UXH6gc0Wp9s7bnS6OLnu9i/YgQL0ejvpR9zK6yK05bW9nxwbSyCcQE6G9Xh9HFTZlJl4cRbYdpJKcHwVGO5xUjMKoaJ5krAA1k2qpccnuc+74CWzuGrtX3UDghv5hD+/VobfcA0vM3w0KcJ43rDr4ds2oxiRJvDJg9VVf1Z/lHHLZX7mrcn8pE8phx+k2mWIgaGEc1n+3aarDZxvqD1BAodXS4UclM5F8oQsWc9pcQVZOW3UZOHMvYaoYp6dPJMgyH5utVnBwwh8k02Ufty8ueoNugLoDPIguon6359dmmDDN46ZsTfkz2+bu+sFOHktuR33lLl/ip/sPDgQGCIcnxN1byK8Pj+P7Q+xXlsDQuUKdt+6GlZNBU/MoIIlWhHuej65v6hcKeneN2tHw4ElwNJGZ74BPF0eZ8xX4Z+pjj0Wd082H189lvGPufym5fVDloKgn3PThrGw0dn3QALv8+XTwXvMcHX/YVIEkf7PrLTNuWMo37zfPMYGXiAe2YZhEwZHZ4Fek66rBJ7tqXkC7GwClk4ZfA9TpR35x3rIWjSLxN5rcV02nuK3hWXA20mbD6U3B5ze2tO0/U9yD/mAotAa4Hx1OM1A3ONY69zAKK6VRwlaIJdeTs73n9+QMxZxoDTuzjNtCnJzdjELAN9S4tOH8c0UVJ5scsmjf/F4IMcajEJaHWkZKPiXKsfgP

[Omar Shehata]

Entities don't expose a computed "forward vector", but you can compute this by getting the entity's orientation (as a quaternion) and multiplying that by some unit vector. CesiumJS doesn't seem to have a method to directly apply a quaternion to a vector, so you'll want to convert the quaternion to a Matrix 3 first:

// orientation is the entity.orientation
var rotationMatrix = Cesium.Matrix3.fromQuaternion(orientation);
// 10 here is the distance I want to push the point away from the origin of the vehicle

var offsetVector = new Cesium.Cartesian3(10, 0, 0);

// Apply the orientation to this vector
offsetVector = Cesium.Matrix3.multiplyByVector(rotationMatrix, offsetVector, offsetVector);

// Offset the dot's position by the computed vector    

var newPosition = entity.position.getValue(viewer.clock.currentTime).clone();

Cesium.Cartesian3.add(newPosition, offsetVector, newPosition);

    

direction.position = newPosition;

Here's a Sandcastle that uses this to put the dot in front of the vehicle.

[crocsx...@gmail.com]

Thank you, I fixed using this which also include Matrix3.

  public createROIfromRotation(position: Cartographic, rotation: HeadingPitchRoll) {

    const cartesianPosition = Cesium.Ellipsoid.WGS84.cartographicToCartesian(position);

    rotation.heading = rotation.heading - CesiumMath.deg2Rad(90);

    const referenceFrame1 = Cesium.Transforms.headingPitchRollQuaternion(cartesianPosition, rotation);

    const rotationMatrix = Cesium.Matrix3.fromQuaternion(referenceFrame1, new Cesium.Matrix3());

    // Replace 1000 for changing the distance

    const rotationScaled = Cesium.Matrix3.multiplyByVector(rotationMatrix, new Cesium.Cartesian3(10000, 0, 0), new Cesium.Cartesian3());

    const roiPos = Cesium.Cartesian3.add(cartesianPosition, rotationScaled, new Cesium.Cartesian3());

  }