VelocityOrientationProperty didn't work

CesiumJS
1

Hello Cesium-community,

I met a problem with velocityOrientationProperty in Cesium, please see the description as follows:

1. A concise explanation of the problem you’re experiencing.

I am working on a cesium project and the goal is to display the vehicles driving according to their gpx tracks on maps. I basically modified the Cesium Workshop tutorial to my case. I have generated the CZML file where the coordinates inside are cartographicDegrees(longtitude, latitude,height). But it seems the orientation of the vehicle didn’t change as the drone in Cesium workshop when running .

2. A minimal code example. If you’ve found a bug, this helps us reproduce and repair it.

var vehicle;
    vehicleroute.then(function(dataSource){
        viewer.dataSources.add(dataSource);
        vehicle = dataSource.entities.getById('Point');
        vehicle.model = {
            uri: './Source/SampleData/Models/CesiumMilkTruck.gltf',
            minimumPixelSize : 12,
            maximumScale : 1000,
            silhouetteColor : Cesium.Color.WHITE,
        };
    });

    vehicle.orientation = new Cesium.VelocityOrientationProperty(vehicle.position);

``

3. Context. Why do you need to do this? We might know a better way to accomplish your goal.

As described in 1.

4. The Cesium version you’re using, your operating system and browser.

Version: 1.57.

FYI, my codes are available on github: https://github.com/kathy-lee/cesium-workshop. Thanks in advance!

Kind regards,

Kathy

2

Already fixed, thanks!

3

Glad you figured it out Kathy! Can you post your solution so others running into the same issue know how to fix it? From a glance here it looks like the VelocityOrientationProperty is created before the the CZML finishes loading?

4

Hi Omar Shehata,

I post the code here, the VeloctiyOrientationProperty should be created inside the “vehicleroute.then(function(dataSource){ }”. Thanks!

       vehicle.orientation = new Cesium.VelocityOrientationProperty(vehicle.position);



    var vehicle;
    vehicleroute.then(function(dataSource){
        viewer.dataSources.add(dataSource);
        vehicle = dataSource.entities.getById('Point');
        vehicle.model = {
            uri: './Source/SampleData/Models/CesiumMilkTruck.gltf',
            minimumPixelSize : 12,
            maximumScale : 1000,
            silhouetteColor : Cesium.Color.WHITE,
        };
       
    });

``

``

``