Reputation: 51
I am trying to make an Angular app which will show the optimised route along with direction of a set of destinations. I installed Azure Maps SDK in my app and started using the APIs. All things are working fine but not the animation API. I am importing maps like this
import * as atlas from 'azure-maps-control';
and then using the animation api as per the documentation:
this.animation = atlas.animation.moveAlongRoute(this.routePoints, this.pin, {
//Specify the property that contains the timestamp.
timestampProperty: 'timestamp',
//Capture metadata so that data driven styling can be done.
captureMetadata: true,
loop: document.getElementById('loopAnimation'),
reverse: document.getElementById('reverseAnimation'),
rotationOffset: (document.getElementById('reverseAnimation'))? 90: 0,
//Animate such that 1 second of animation time = 1 minute of data time.
speedMultiplier: 60,
//If following enabled, add a map to the animation.
map: (document.getElementById('followSymbol'))? this.map: null,
//Camera options to use when following.
zoom: 15,
pitch: 45,
rotate: true
});
});
});
}
But it is giving the error like
Property 'animation' does not exist on type 'typeof atlas'
I also needed the service module, so I import it from
import * as atlases from 'azure-maps-rest';
This time by using this import, I was able to use atlases.services module, but now some interface error is coming stating that
Type 'undefined' does not satisfy the constraint 'IBaseGeojson'.
2153 G extends IBaseGeojson = undefined> = D & (G extends undefined ? {
Upvotes: 3
Views: 517
Reputation: 1389
You can try adding azure-maps-animations
JavaScript file from the dist
folder into your project from this link to use with azure maps web sdk.
And for Azure Maps Service Module, atlas-services-ui
JavaScript and CSS files and the localization
folder from the dist
folder into your project from this link.
Upvotes: 0